html三次笔记源码课件.pdf

Css

什么是css

层叠样式表(英文全称：CascadingStyleSheets)是一种用来表现HTML

Css作用

1.美化网页,控制html文档显示时的样式，比如颜色、字置。

css注释

针对于开发者，不会被浏览器解析

/*

注释内容

*/

应用csshtml页面当中

在一个html页面当中使用css，有三种方式

方式一、内联样式：直接把css规则写到html的上style属性中

属性:值;

方式二、样式：可以写在head当中，添加一个style然后把css规则写在里面

选择器{

值1;

属性2:值2

}

例子：让页面所有的h1为蓝色背景

方式三、外部样式表

我们可以单独写一个文件文件后缀为.css，然后把css规则写进去,然后在html页面当中，使

用一个link引入css文件

使用link元素调用CSS的语法如下：linkrel=stylesheethref=css文件路径type=text/css/

其中rel=stylesheet指这个link和其href之间的关联样式为样式表文件。type=text/css

指文件类型是样式表文本。

单独css文件

引入css文件

方式四引入样式表文件

使用@importurl(‘文件地址’);

使用@import调用和使用link元素调用的区别在于，使用@import的调用方法只能使用

在样式文件中，即只能在调用的样式文件，或style元素中才能正常使用

第一种在style当中

第二种在css文件当中其它的css文件

Css的选择器

选择器分类

选择器（html元素选择器）

通配符选择器

类选择器（class）

Id选择器

伪类选择器

组合选择器（多元素选择器、子元素选择器、后代选择器）

选择器

根据名称选择一类。来进行修饰

通配符：选择所用的

场景：设置所有的文字大小，文字颜色。

想要统一页面的样式，一般会去除所有边距

去除的

类选择器

基本语法

.类选择器{

值1;

属性2:值2

}

扩展：一个上是可以使用多个样式名称，多个之间用空格隔开

一个类样式可以给在多个上

Id选择器

基本语法

#选择器名称{

值1;

属性2:值2

}

代码：

匹配所有id属性等于P的元素,并且id名称为red

扩展：

1.虽然可以使用多个id选择器为html元素设置样式，但是一般不要去设置多个，一个id选

择器对应着一个html元素（唯一）。

2.如果要为多个使用同一个样式，请使用class选择器

使用场景

为js调用做准备或者是强调特别重要的内容

组合选择器

多元素选择器

基本语法

元素名称,元素名称,元素名称{