1. CSS背景样式?
background-color 背景色 background-image 背景图 url(背景地址) 默认:会水平垂直都铺满背景图 background-repeat 平铺方式 repeat-x x轴平铺 repeat-y y轴平铺 repeat ( x , y 都进行平铺,默认值 ) no-repeat 都不平铺 background-position : 背景位置 x y : number(px、%) | 单词 x : left、center、right y : top、center、bottom background-attachment : 背景图随滚动条移动的方式 scroll : 默认值 ( 背景位置是按照当前元素进行偏移的 ) fixed ( 背景位置是按照浏览器进行偏移的 ) ⭐️在浏览器中无效的问题:图片路径要写对
2. CSS边框样式? border-style : 边框样式 solid : 实线 dashed : 虚线 dotted : 点线 border-width : 边框大小 px ... border-color : 边框颜色 red #f00 ...
边框也可以针对某一天边进行单独设置 : border-left-style : 中间是方向 left、right、top、bottom
颜色:透明颜色 transparent
3. CSS文字样式?
font-family : 字体类型 英文、中文 ⭐️用在英文上的样式在中文中无效 中文字体则是两者都可以识别 默认微软雅黑 衬线体:有棱角的、非衬线体 :平滑的 现在用非衬线体的多,因为适应扁平化的网站 注意点: 1.多个字体类型的设置目的:如果当前电脑中没有字体就设置成后一种,都没有就计算机默认的 2.引号的添加的目的 font-size : 字体大小 默认 : 16px 写法 : number(px) medium默认大小| 单词 ( small large ... 不推荐使用) ⭐️字体大小一般为偶数,目的是方便字体对齐
font-weight : 字体粗细 模式: 正常( normal ) 加粗 ( bold ) 写法:单词(normal、bold) | 法二:number ( 100 200 ..... 900 , 100到500都是正常的,600都900都是加粗的 其实就两种效果)
font-style : 字体样式 模式: 正常 ( normal ) 斜体 ( italic ) 写法:单词 ( normal 、 italic ) 注:oblique也是表示斜体,用的比较少,一般了解即可。 区别:1.italic 带有倾斜属性的字体的才可以设置倾斜操作。 2.oblique 没有倾斜属性的字体也可以设置倾斜操作。
4. CSS段落样式? text-decoration:文本装饰 下划线 : underline 删除线 :line-through 上划线 : overline 不添加任何装饰 : none ⭐️注:添加多个文本修饰:line-through underline overline text-transform:文本大小写 ( 针对英文段落 ) 小写:lowercase 大写:uppercase 只针对首字母大写:capitalize text-indent : 文本缩进 首行缩进 em单位:相对单位,1em永远都是跟字体大小相同
text-align : 文本对齐方式 对齐方式 : left 、right、center、justify(两端点对齐)
line-height : 定义行高
什么是行高,一行文字的高度,上边距和下边距的等价关系。 默认行高:不是固定值,而是变化的。根据当前字体的大小再不断的变化。
取值:1. number( px ) | scale ( 比例值 , 跟文字大小成比例的 )就写数字
letter-spacing : 字之间的间距 word-spacing : 词之间的间距 ( 针对英文段落的 )
英文和数字不自动折行的问题: 1. word-break : break-all; (非常强烈的折行) 2. word-wrap : break-word;(不是那么强烈的折行 ,会产生一些空白区域)
5. CSS复合样式:
复合的写法,是通过空格的方式实现的。复合写法有的是不需要关心顺序,例如background、border;有的是需要关心顺序,例如font。 1. background : red url() repeat 0 0; 2. border : 1px red solid; 3. font : 注:⭐️最少要有两个值 size family 必须先文字大小再字体 color是不包括在里面的 weight style size family √ 粗细 样式 大小 字体 style weight size family √ weight style size/line-height family √ 注:如果非要混合去写的话,那么要⭐️⭐️⭐️先写复合样式,再写单一样式,⭐️⭐️⭐️这样样式才不会被覆盖掉。