随笔分类 - css
摘要：前言: 如果你使用过 CSS 预处理器，比如 SASS，以下示例你或许碰到过 其实,css中也带有如上面这个代码一样的简单表达式运算 并且,css的表达式和使用css预处理器的差别在于: 浏览器解析的 calc() 的值为真实的 calc() 表达式 ,而预处理器则被编译为'固定值',如下: 这意味
阅读全文
摘要："没人告诉你关于z index的一些事" 堆叠顺序 z index看上去很简单，z index值大的元素在z index值小的元素前面，对吧？但其实这只是z index的一部分用法。很多程序猿都觉得很简单，没有花太多时间去认真阅读规则 HTML中的每一元素都是在其他元素的前面或者后面。这是众所周知的
阅读全文
摘要：效果如下: 为什么会出现间距呢? 把html换成如下: 效果如图: 获取UL的子节点: 可以看到，第一个li和第二个li之间有一个text的节点，而第二个li和第三个li之间并没有节点。 这是因为 换行符被浏览器解析为text节点 解决方法: + li标签不换行 + font size:0px
阅读全文
摘要：主要参考了这篇文章 "如何居中一个元素（终结版）" "行内元素" "水平居中" "垂直居中" "单行 内联元素" "多行内联元素" "利用flex布局" "利用表布局（table）" "块级元素" "垂直居中" "已知child高度宽度 使用absolute+负margin" "未知child宽高
阅读全文
摘要：什么是CSS 盒子模型(Box Model) 所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。 CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：外边距(padding)，边框(border)，内边距(margin)，和实际内容(conte
阅读全文
