2023年4月13日
vscode的格式化的settings.json的个人配置
摘要： vscode的格式化的settings.json的个人配置 { // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, //黄色波浪线 "eslint.enable": false, // 重新设定tabsize " 阅读全文
posted @ 2023-04-13 08:04 土著古 阅读(1470) 评论(0) 推荐(0)
2023年3月26日
雪碧图
摘要： 雪碧图 CSS Sprite也叫CSS精灵图,CSS雪碧图,是一种网页图片应用处理方式.它允许你将一个页面涉及到的所有零星图片都包含一张大图中去 优点 减少图片的字节 减少网页的http请求,从而大大的提高页面的性能 原理 通过background-image引入背景图片 通过background- 阅读全文
posted @ 2023-03-26 21:09 土著古 阅读(76) 评论(0) 推荐(0)
媒体查询
摘要： 媒体查询 媒体查询能使页面在不同在终端设备下达到不同的效果 媒体查询根据设备的大小自动识别加载不同的样式 设置meta标签 使用设备的宽度作为视图宽度并禁止初始的缩放.在<head>标签里加入这个meta标签. <meta name="viewport" content="width=device- 阅读全文
posted @ 2023-03-26 20:51 土著古 阅读(30) 评论(0) 推荐(0)
2023年3月25日
动画
摘要： 动画 动画是使元素从一种样式逐渐变化另一种样式的效果 你可以改变任意多的样式任意多的次数 请用百分比来规定变化发生的时间,或用关键词"from"和"to",等同于0%和100% 0%是动画的开始,100%是动画的完成. @keyframes创建动画 使用@keyframes规则,你可以创建动画 @k 阅读全文
posted @ 2023-03-25 21:25 土著古 阅读(91) 评论(0) 推荐(0)
css3新特性
摘要： css3新特性 圆角 使用CSS3 border-radius属性,你可以给任何元素制作"圆角" border-radius属性,可以使用以下规则: 四个值:第一个值为左上角,第二个值为右上角,第三个值为右下角,第四个值为左下角 三个值:第一个值为左上角,第二个值为右上角和左下角,第三个值为右下角 阅读全文
posted @ 2023-03-25 21:24 土著古 阅读(18) 评论(0) 推荐(0)
定位
摘要： 定位 定义 position属性指定了元素的定位类型 | 值 | 描述 | | | | | relative | 相对定位 | | absolute | 绝对定位 | | fixed | 固定定位 | 其中,绝对定位和固定定位会脱离文档流 设置定位之后:可以使用四个方向值进行调整位置:left,to 阅读全文
posted @ 2023-03-25 11:14 土著古 阅读(30) 评论(0) 推荐(0)
2023年3月23日
清除浮动
摘要： 清除浮动 浮动副作用 当元素设置float浮动后,该元素就会脱离文档流并向左/向右浮动. 浮动元素会造成父元素高度塌陷 后续元素会受到影响 <div class="container"> <div class="box"></div> <div class="box"></div> <div cla 阅读全文
posted @ 2023-03-23 21:51 土著古 阅读(25) 评论(0) 推荐(0)
浮动
摘要： 浮动 浮动的定义 float属性定义元素在哪个方向浮动,任何元素都可以浮动. | 值 | 描述 | | | | | left | 元素向左浮动 | | right | 元素向右浮动 | 浮动的原理 浮动以后使元素脱离了文档流 浮动只有左右浮动,没有上线浮动 元素向左浮动 脱离文档流之后,元素相当于页 阅读全文
posted @ 2023-03-23 20:56 土著古 阅读(50) 评论(0) 推荐(0)
文档流
摘要： 文档流 文档流是文档中可显示对象在排列时所占用的位置/空间 例如:块元素自上而下摆放,内联元素,从左到右摆放标准流里面的限制非常多,导致很多页面效果无法实现 高矮不齐,底边对齐 空白折叠现象 无论多少个空格,换行,tab,都会折叠为一个空格 如果我们想让img标签之间没有空隙,必须紧密连接 文档流产 阅读全文
posted @ 2023-03-23 20:26 土著古 阅读(23) 评论(0) 推荐(0)
2023年3月22日
弹性盒子模型
摘要： 弹性盒子模型(flex box) 定义 弹性盒子是CSS3的一种新的布局模式 CSS3弹性盒子是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式 引入弹性盒子布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列.对齐和分配空白空间 CSS3弹性盒内容 弹 阅读全文
posted @ 2023-03-22 22:30 土著古 阅读(131) 评论(0) 推荐(0)