![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS
澹台十三
这个作者很懒,什么都没留下…
展开
-
CSS- 伪类
伪类 之所以叫 伪类 , 是因为我们是基于元素的状态来选择的,而不是他的名字或者属性。 用 法 /* 尚未访问过的链接 */ a:link{ color : red ; } /* 鼠标在链接上徘徊 ,还没有点击的状态 */ a:hover{ color : cyan ; texe-decoration : underline ; } /* 当链接被点击后的状态 , 链接本身的样式有点变...原创 2019-12-23 15:59:14 · 71 阅读 · 0 评论 -
CSS - 文本
行距 用 法 line-height : 1.6em ; /* 1em相当于当前字体的尺寸,2em 就等于当前字体的 2 倍 */ 字母间距 用 法 letter-spacing : 3em ; /* 每个字之间距离会增加 3em */ 文本对齐方式 用 法 text-align : center ; /* 文字 居中对齐 */ text-align : left ; /* ...原创 2019-12-23 15:19:47 · 103 阅读 · 0 评论 -
CSS - 字体
一、字号 用 法 p{ /* 第一种 */ font-size : 16px; /* 第二种 */ font-size : 100%; /* 第三种 */ font-size : 1em; } 单 位 px 像素 % 百分数 - - ->>> 假如文中的字号是16px , 100% 等于 16px , 200% 等于 32px . em 值 - - - - - ->&...原创 2019-12-23 14:54:39 · 128 阅读 · 0 评论 -
CSS - float 布局
float 布局 可以兼容 IE 9 浏览器 float : left; float : right; 步骤 子元素上加float : left和 width; 在父元素上加 .clearfix。 .clearfix:after { display: block; content: " "; clear: both; } 注意 有经验者会...原创 2019-12-12 19:47:36 · 118 阅读 · 0 评论 -
CSS - 基本单位
长度单位 px 像素 em 相对于自身font-size 的倍数 百分数 整数 rem vw 和 vh 其他的长度单位比较少用 颜色 十六进制 #121212 或者 #CC1144 RGBA 颜色rgb(0,0,00)或者rgba(0,0,0,1) hsl 颜色 hsl(360,100%,100%) ...原创 2019-12-10 22:30:40 · 118 阅读 · 0 评论 -
CSS - margin 合并
margin 合并 哪些情况会合并? 父元素和子元素 marign 合并 兄弟元素 margin 合并 如何阻止合并 父元素和子元素合并用 padding / border 挡住 父元素和子元素合并用 overflow / hidden 挡住 父元素和子元素合并用 display : flex 兄弟合并是符合预期的 兄弟合并可以用inline-block消除 注意 margin 只会...原创 2019-12-10 22:24:18 · 179 阅读 · 0 评论 -
CSS -盒模型
盒模型 content-box内容盒 - 内容就是盒子的世界 border-box 边框盒 - 框架材质盒子的世界 公式 内容盒 content-box width = 内容宽度 .con { margin: 25px; border: 5px solid red; padding: 15px; ...原创 2019-12-10 21:53:31 · 86 阅读 · 0 评论 -
CSS-文档流和 overflow 溢出
文档流 流动方向 inline 元素从左到右,到达最右边才会换行; block 元素从上到下,每一个都另起一行; inline-block 也是从左到右, 宽度 inline 宽度为内部 inline 元素的和,部能用 width 指定; block 默认自动计算宽度,可用 windth 指定; inline-block 结合前两者特点,可用 width。 高度 inline 高度由 ...原创 2019-12-10 21:18:15 · 608 阅读 · 0 评论