Day02 javaweb视频教程-css

不管这概括的内容怎么样，这么好听的音乐是不是就应该给个赞（赏）！

css 层叠样式表（主要由美工部分负责，只要能看懂就行，不用太纠结）。

再用css时可以到网上找使用手册，每个属性都记载的很清楚。

1.功能：将网页内容和显示样式进行分离，提高了显示功能。

放张照片压压惊，我也不知道为啥选这个

2.css与html四种结合方式

第一种：在标签中加style属性，多个属性都放在一个双引号下

第二种：

第三种：在style标签里面 使用@import url(css文件的路径)

@import url

第四种:使用头标签link，引入外部css文件

注：第三种在一些浏览器下不起作用，一般都使用第四种

优先级：（一般情况）从上到下，从外到内，优先级由低变高，后加载的优先级高

3.css选择器：

标签选择器：使用标签名作为选择器的名称

类（class）选择器：每个html标签都有属性class，可以用class的属性值作为选择器名称，还可以用div.class属性值，来设置一部分div标签。.class属性值表示所有属性名一样的标签都改变样式。

id选择器：#id属性值。

基本选择器优先级：style>id>类>标签(标签中的style属性)

扩展选择器:

关联选择器

设置div中的p标签样式，可以设置嵌套标签里面的样式

div p { } 在标签间加个空格

组合选择器

把div和p标签设置成相同的样式，把不同的标签设置成相同的样式

div，p { } 在标签间加个逗号（英文半角)

伪元素选择器 css中定义好的，直接拿来使用。有很多比如超链接点击前，覆盖和点击后的不同等等，用时百度即可，

........

重点来了

4.盒子模型：属性:

边框border width,color,style

内边距padding length

外边距margin auto,length

三个属性都有上下左右，都可以分别设置也可以统一设置。

5.float浮动布局（了解，用得少，不同浏览器显示效果不同）

属性：none，right，left

浮动布局就跟水泡一样，从下面往上漂浮起来，当属性为left时，就是从左边漂浮，当遇到阻碍（其余块元素）时就会往右边走。也就是说从左边往上走然后往右边跑，直到“卡”住不动，或者到达顶部。right同理。

6.定位布局

position：

absolute绝对定位 在页面的任意位置，设置以后将保持位置不动。相当于在空中漂浮，会覆盖其余元素

relative相对定位 与上面的区别是不是漂浮在空中，在界面中还有位置。

都可以用top，bottom来确定位置

最经典的事图文混排folat和图像签名position

***css属性非常多，有时会增加，有些会被遗弃。所以在使用时要看看css的文档。