html

---恢复内容开始---

css引入方式1:

　　行内式

css引入方式2:

　　head里写入

css的引入方式3:

　　外部链接

他们的优先级:行内>head里的=外部链接

选择器:标签选择器:

　　　　　通过标签名直接选择到所有的标签,实际应用场景很少

　　　id选择器

　　　　　通过#id值选择到对应的id,具有唯一性,且优先级高于标签选择器

　　　类选择器

　　　　通过.类名选择到对应的一类标签,不具备唯一性,且优先级高于标签选择器

　　　通配符选择器

　　　　通过*选择到页面上所有的标签,实际应用场景比较少

　　　选择器优先级:

　　　　id>类>标签>*

进阶选择器:

　　后代选择器:

　　　　通过至少一个空格,实现后代选择器的效果

　　子代选择器:

　　　　通过>知道所有的子代

　　所有兄弟选择器

　　　　通过~找到所有的兄弟,只要是同级的,都可以被找到

　　向下相邻的弟弟选择器

　　　　通过+找到向下相邻的兄弟

组合选择器:

　　仅仅通过逗号来组合起多个选择器,目的为了重用一些共有的css属性

选择器优先级:

　　行内>id>类>标签>通配符

　　后代选择器因为选择的范围比较模糊,要低于选择精准的选择器

　　模糊度越高优先级越低

标准文档流:

　　空白折叠现象

　　自动换行

　　去除空格,把代码中空白区域删除掉

　　不同类型的行内元素或者行内快元素,对应的基准线不一致

字体属性

　　font-family:设置不同类型的字体,宋体,微软雅黑之类的

　　font-size:设置字体的大小,单位是像素

　　font-weight:字体宽度

颜色相关

　　字体颜色用cloor

　　背景颜色用bgc

　　颜色的设置:

　　　　命名法

　　　　rgb(255,255,255)

　　　　#16进制写法

　　　　rgba(255,255,255,透明度)

文本样式

　　对齐方式

　　　　text-align:left,center,right

　　首行缩进

　　　　text-index:px,也可以是em,em是一个相对单位,相对于字体的大小

　　单词之间的间距:

　　　　word-spacing:100px

　　　　letter-spacing:中文件之间的字间距,设置值可以使px或者em

　　大小写转换

　　　　text-transform:lowercase小写,uppercase大写,capitalize首字母大写

　　文本的装饰

　　　　text-decoration:none清除a标签自带的下划线,line-through打折的时候的那个价格删除线

　　文本的方向

　　　　direction:rt1

　　　　他跟文本的对齐方式没有区别,是因为没有设置unicode-bidi: bidi-override;

　　　　两个属性一起使用就能实现文本的方向的改变,默认是从左到右,还可改变为从右到左

宽高

　　宽高只能给行级标签设置

　　给行内标签设置不起作用

　　宽高还能给行内快标签设置

　　line-height行高给行内标签设置也不管用

　　给文本类或者行内标签的元素设置垂直居中,可以利用line-height来设置

display属性

　　行级标签变形为行内标签在行级标签里设置display:inline

　　行内标签变形为行级标签在行内标签设置display:block

　　行级标签或者行内标签变形为行内块标签:display:inline-block

背景相关操作:

　　background-image:url(图片的路径)

　　background-repeat:图片是否铺满

　　background-position:相对于左上角的点,往右平移是正直,往下平移也是正直,否则相反

伪类选择器

　　爱恨准则

　　最特殊是hover,他不单单可以给a标签使用

伪元素选择器

　　before,在元素之前添加一些内容

　　after,在元素之后添加一些内容

　　first-letter,在首字母发生一些改变

　　first-line,在首行进行一些操作

做appele,小米网

　　

　　

 

 

　　

　　

 

 

 

 

 

 

 

 

 

 

 

 

 

---恢复内容结束---