Sass 介绍及快速入门
Sass 是由 Ruby 语言编写的一款 CSS 预处理语言。它是一款强化 CSS 的辅助工具，是对 CSS 的扩展，扩展了嵌套、混合、继承、导入等高级功能，这些拓展令 CSS 更加强大优雅，可以更好的组织管理样式文件，从而更高效的开发项目
辰风沐阳 阅读 649 2023-03-20
CSS overflow 内容溢出时的显示方式
css 中的 overflow 属性用于控制内容溢出元素框时的显示方式。当元素框中的内容溢出时，无非就是两种情况: 溢出部分隐藏、溢出部分通过滚动条查看。最常见用法是: overflow: hidden; (溢出隐藏) overflow: auto; (内容溢出时显示滚动条)
辰风沐阳 阅读 749 2022-08-16
CSS 选择器详细分类
CSS 选择器有很多类型: 通配符选择器、标签选择器、类选择器、id选择器、群组选择器、后代选择器、子代选择器、交集选择器、兄弟选择器、属性选择器、伪类选择器。使用合适的选择器可以更好匹配元素，CSS 样式代码更加优雅
辰风沐阳 阅读 583 2022-08-06
CSS font-family 属性设置字体
font-family 属性用于给元素指定字体，该属性的值是一个字体系列，每个值使用逗号隔开，如果字体名名称包含空格，那么字体名称必须使用引号包裹，设置的字体是否可用取决于用户机器上该字体是否可用
辰风沐阳 阅读 894 2022-07-28
玩转 CSS Flexbox 弹性布局
本文记录 CSS 弹性布局中常用的属性及其属性值。创建 flex 块级容器: display: flex; 创建 flex 行内容器 display: inline-flex。定义主轴方向: flex-direction: row; 水平方向为主轴(默认值) flex-direction: column; 垂直方向为主轴
辰风沐阳 阅读 597 2022-07-24
CSS 控制内容显示行数
显示一行内容，超出部分使用省略号表示（只有块元素才会生效）overflow: hidden; text-overflow: ellipsis; white-space: nowrap; 显示两行或三行，超出部分用省略号显示，需要使用 -webkit-box-orient: vertical;
辰风沐阳 阅读 742 2022-07-07
flex 弹性布局常用属性
flex 是 Flexible Box 的缩写, 意为弹性布局，又称为弹性盒布局、伸缩盒布局。用来为盒状模型提供最大的灵活性，任何一个容器都可以指定为 Flex 布局。通过给父元素添加 flex 属性，来控制子盒子的位置和排列方式
辰风沐阳 阅读 741 2022-01-11
CSS 边框属性总结
CSS边框属性：1. 基本属性（border）边框宽度、边框样式、边框颜色 2. 边框倒角（border-radius）3. 边框阴影（box-shadow）4. 轮廓属性（outline）
辰风沐阳 阅读 1123 2020-09-10
父元素透明度不影响子元素透明度解决方案
父元素设置opacity：0.5，子元素会受到父元素opacity的影响，也会有0.5的透明度。即使设置子元素opacity：1，子元素的opacity：1也是在父元素的opacity：0.5的基础上设置的，因此子元素的opacity还是0.5。
辰风沐阳 阅读 1260 2020-06-26