摘要：
bug:图片底部会有一个空白缝隙，原因是行内块元素和文字的基线对齐。 主要解决方法有两种: 1.给图片添加vertical-align: middle | top | bottom等。（提倡使用） 2.把图片转换为块级元素 display: block; 阅读全文
摘要：
给父盒子设置"position: relative;"相对定位，给子盒子设置"position: absolute;"绝对定位。使用"left: 50%;"和"top: 50%;"让子盒子距离父盒子左边和顶部距一半的距离，此时由于子盒子的左边框和上边框在父盒子的中间线处，所以需要退回子盒子一半距离的 阅读全文
摘要：
问题1.什么是精灵图？ 精灵图就是一张将多个图标放置在一起的图片。 问题2.为什么要用精灵图？ 使用精灵图，将多个图标放在一张图上，访问网页时只需要将这一张图片下载到本地即可在网页上看到这张图片上的所有图标。可以使用户在访问网页的时候，减小服务器压力，加快网页加载速度。（大家都喜欢秒加载） 问题3. 阅读全文
摘要：
1.display： display除了可以设置元素的类型，还可以用于显示和隐藏元素。 display: none; 有隐藏元素的功能 display: block; 除了转换成块级元素外，还有显示元素的功能 display隐藏元素后，不再占有原来的位置（脱标） 2.visibility： visi 阅读全文
摘要：
1.额外标签法 选择器 { clear: 属性值; } left 不允许左侧有浮动元素（清除左侧浮动的影响） right 不允许右侧有浮动元素（清除右侧浮动的影响） both 同时清除左右两侧浮动的影响 实际工作中，几乎只用clear:both; 清除浮动的策略是：闭合浮动（在需要格挡的元素后加</ 阅读全文
摘要：
链接：https://blog.csdn.net/WX_nbclass/article/details/124522118 阅读全文
摘要：
1.相对定位：relative 一般用来给绝对定位当爹用，将绝对定位的子盒子限制在父盒子之中。 特点：不脱标，也就是说原本占有的位置不会被其他盒子所挤占。 2.绝对定位：absolute 绝对定位需要依托父盒子进行定位，如果没有父盒子或祖先盒子，则以浏览器为准定位（Document文档）。 如果父/ 阅读全文
摘要：
建议遵循以下顺序： 1.布局定位属性：display position float clear visibility overflow(建议display第一个写，毕竟关系到模式) 2.自身属性：width height margin padding border background 3.文本属性 阅读全文
摘要：
lex实际上是flex-grow、flex-shrink和flex-basis三个属性的缩写。 flex:1 => flex: 1 1 auto; 原文链接：https://blog.csdn.net/weixin_43554584/article/details/113839778 阅读全文
摘要：
在样式表定义一个样式的时候，可以定义id也可以定义class。 1、在CSS文件里书写时，ID加前缀"#"；CLASS用"." 如只能用id #nav { width: 600px; height: 40px; margin: 0 auto;} <div id="nav"> xxxxxxxxxxxx 阅读全文