css选择符的分类：共分8种-----看张鹏老师视频PPT课件所得

末蓝、 2022-08-06 00:11 98阅读 0赞

**1、标签（类型）选择符：**就是针对html文档中的标签（哪些html标签应用哪些css样式）

**标签\{属性：值\}**

例如：p\{font-size:12px;\}

div\{background:blue;\}

**2、类选择符：**可以自己定义样式，应用于一个或多个网页元素，类在网页中可以出现多次，用于定义重复的样式。

类以英文点“.”开头，后面的名字自己定义，类定义后还需要在网页中加入class=”类名称“，加以调用。

在样式中

**.类名称\{属性：值\}**

在body中

**<标签 class=“类名称”>......</标签>**

例如：

.warning\{ 属性：值\}

<p class="warning">......</p>

同时给某个元素应用多个类，类之间用空格隔开

** <标签 class=“类名称1   类名称2”>......</标签>**

例如：

<p class="a1 a2">......</p>

**3、id 选择符：**与类相似，只是以英文“\#”开头，因为id具有唯一性，所以在网页中只能出现一次，用于定义只出现一次的样式。

在样式中

**\#id名称\{属性：值\}**

在body中

**<标签 id=“id名称”>......</标签>**

例如：

\#warning\{属性：值\}

<p id="warning">......</p>

同时给某个元素应用多个类与id，

** <标签 class=“类名称1   类名称2” id=“id名称”>......</标签>**

例如：

<p class="a1 a2" id="a6">......</p>

**4、通配选择符：**用于定义所有html元素

** \*\{ 属性：值\}**

** 5、包含选择符：**配套或派生，选择符的嵌套使用

**大标签 小标签\{属性：值\}**

例如：table td\{属性：属性值\}     \#header li a\{属性：属性值\}

优点：就是不需要再单独为id为header的标签内，li标签内的a标签单独定义class或id，css代码就少了，同样也优化了css代码

** 6、选择符分组(集体控制)：**将同样的样式定义用于多个选择符，选择符之间用逗号分隔

**选择符1，选择符2，选择符3......\{属性：属性值\}**

例如：p,div,.class\{属性：属性值\}

**7、标签指定式选择符：**如果既想使用id或class，也想同时使用标签选择符

例如：**h1\#content\{\}**表示针对所有id为content的h1标签

**h1.p1\{\}**表示针对所有class为p1的h1标签

**8、组合选择符：**将以上选择符进行组合使用

例如：**h1.p1，\#content h1\{\}**

发表评论取消回复

表情：

评论列表（有 0 条评论，98人围观）

还没有评论，来说两句吧...

相关阅读

相关计算机网络的分类 ppt,《计算机网络》PPT课件.ppt

《《计算机网络》PPT课件.ppt》由会员分享，可在线阅读，更多相关《《计算机网络》PPT课件.ppt(20页珍藏版)》请在装配图网上搜索。 1、第 13章网络故障与排除

柔情只为你懂/ 2022年10月07日 04:45/ 0 赞/ 197 阅读

相关笔记4_看张鹏老师html+css视频所得

1、网页布局：（1）网页如何去排版(布局)\---传统通过table进行排版----主流是通过xhtml+css布局（2）布局的核心思想：

太过爱你忘了你带给我的痛/ 2022年08月14日 03:52/ 0 赞/ 100 阅读

相关笔记3_看张鹏老师html+css视频所得

三、html文档结构 1、做网页的----要用html文件----用浏览器打开 2、所有html文件都有一个结构（框架、骨架）

快来打我*/ 2022年08月14日 03:51/ 0 赞/ 88 阅读

相关笔记2_看张鹏老师html+css视频所得

二、html标记的类型：单标记与双标记 1、单标记（1）<标记名称> 单一型，无属性值如：<br /> （2）<标记名

ゝ一纸荒年。/ 2022年08月14日 03:51/ 0 赞/ 85 阅读

相关 css应用给网页的4种方式（看张鹏老师的视频课程后所总结的）

1、让文字垂直居中html代码： ![20141017011201259][] 2、css应用给网页的四种方式：第1种：行内样式：应用于一个

末蓝、/ 2022年08月13日 10:00/ 0 赞/ 121 阅读

相关 html超级链接（看张鹏老师的视频课程后所总结的）

一、超级链接基本语法： <a href="链接目标" title=“鼠标放上面出现的文字” target=“打开链接窗口的形式（在新窗口还是自身窗口）”>显示内容</a>

ゝ一世哀愁。/ 2022年08月13日 00:44/ 0 赞/ 78 阅读

相关 css基本语法结构（看张鹏老师的视频课程后所总结的）

1、css基本语法结构：选择符（即选择器）\{属性:属性值;\} 例如：body\{font-size:12px;\} 2、为了将来的css代码优化，建议，所

╰+攻爆jí腚メ/ 2022年08月10日 12:54/ 0 赞/ 85 阅读

相关笔记1_看张鹏老师html+css视频所得

网页设计师：包括设计（PS网页效果图设计、Flash网页动画设计）和制作（Html、Xhtml、DIV+CSS和Javascript、JQuery）一、

妖狐艹你老母/ 2022年08月10日 11:49/ 0 赞/ 113 阅读

相关 css选择符的分类：共分8种-----看张鹏老师视频PPT课件所得

1、标签（类型）选择符：就是针对html文档中的标签（哪些html标签应用哪些css样式）标签\{属性：值\}

末蓝、/ 2022年08月06日 00:11/ 0 赞/ 99 阅读

相关 css3种布局方式：默认文档流、浮动布局、定位布局-----看张鹏老师视频笔记

> > > > 一、css布局的方式： > > > > > > > > 1、默认的，就是按文档流的顺序，即按html的结构顺序。 > >

骑猪看日落/ 2022年08月05日 19:29/ 0 赞/ 144 阅读