Css篇
文章平均质量分 60
Css小tips
程序员xiaolibao
编码过程中,知识总结...
展开
-
#Css篇:flex布局的总结容器和项目
flex-basis属性定义了在分配多余空间之前,项目占据的主轴空间(main size)。浏览器根据这个属性,计算主轴是否有多余空间。它的默认值为auto,即项目的本来大小。原创 2024-01-09 17:20:36 · 911 阅读 · 0 评论 -
#Css篇:实现一个元素水平和垂直居中&&实现左右固定,中间自身适应布局&& 左侧固定 右侧自适应
教程:https://www.ruanyifeng.com/blog/2019/03/grid-layout-tutorial.html。原创 2023-12-01 10:41:38 · 280 阅读 · 0 评论 -
#Css篇:flex梳理学习
flex布局的梳理01 text-align: center、verticle-align: middle对于行内样式有效02 随着 Web 语义化的流行,这些写法逐渐淡出了视野,CSS 标准为我们提供了 3 种布局方式:标准文档流、浮动布局和定位布局。03 传统第一种.dad { position: relative;}.son { position: absolute; margin: auto; top: 0; right: 0; bott原创 2020-10-29 22:10:59 · 84 阅读 · 0 评论 -
#Css篇: p:nth-child--匹配任何类型的父元素下的第n个子元素和p:nth-of-type---匹配同类型子元素中的第n个元素
示例:.class p:nth-child(3) 将选择 .class 类中的第3个子元素,如果这个子元素是。示例:.class p:nth-of-type(2) 将选择属于 .class 类的所有元素中的第二个。只计算同一类型(元素标签名相同)的兄弟元素,并按顺序从1开始计数。该选择器匹配其父元素中第 n 个子元素,不论元素类型是什么。该选择器匹配其父元素中指定类型的第 n 个元素。计算所有类型的兄弟元素,并按顺序从1开始计数。原创 2021-04-16 23:34:27 · 272 阅读 · 0 评论 -
#Css篇:Sass @mixin 与 @include
extend指令通过继承从而简化了代码,但是它也有缺陷之处,首先是不够灵活,其次它还会将你不需要的其他地方具有相同类名的样式都继承过来。@mixin指令是另一种简化代码的方法。Mixins可以包含任意内容且可以传递参数,因此比’@extend’更加灵活和强大。为了有效的维护和开发项目,代码的重复利用就显得尤为重要。以使你的代码更加具有重复利用性,@mixin指令也同样能提高你代码的重复使用率并简化你的代码。mixin.css里面声名。index.scss里面。原创 2022-10-13 15:53:09 · 361 阅读 · 0 评论 -
#Css篇: box-sizing: content-box& box-sizing: border-box
box-sizing 是 CSS 中的一个属性,用于指定元素的总尺寸应该如何计算。原创 2022-10-12 14:31:45 · 238 阅读 · 0 评论