《网站建设与管理》课件 项目7 CSS层叠样式表.pptx

项目7CSS层叠样式表;;PART1;CSS可修改网页的字体、颜色、背景、边框等布局效果，从而美化网页外观。借助dreamweaver强大的图形界面功能，可快速地新建和应用CSS规则，完成“阳光小学网”。;PART2;;PART3;CSS层叠样式表; 定义选择器HTML语言中的标记是通过不同的CSS选择器进行控制的，选择器包括标签选择器、类别选择器、ID选择器和复合选择器。

1定义选择器

1)标签选择器

CSS标记选择器就是声明某个标记直接采用某个样式，包括所有的HTML标签。如通过h1选择器用来声明页面中所有的h1标记的文字效果。

声明声明

h1{color:red;font-size:50px;}

?标签选择器名属性值属性值

; 定义选择器HTML语言中的标记是通过不同的CSS选择器进行控制的，选择器包括标签选择器、类别选择器、ID选择器和复合选择器。

1定义选择器

2)类别选择器

类别选择符的定义通常在最前面加一个点号，类别选择符的名称可自行定义，可以以英文开头，再与下划线或数字的组合，一般以其功能和效果简要命名，不要以数字开头，数字开头的名称在Mozilla/Firefox浏览器中不起作用。

声明声明?

.class{color:red;font-size:50px;}

类别选择器名属性值属性值?; 定义选择器HTML语言中的标记是通过不同的CSS选择器进行控制的，选择器包括标签选择器、类别选择器、ID选择器和复合选择器。

1定义选择器

3)ID选择器

ID选择器通常是唯一性的，即同一页面中的ID选择器名称不能重复出现。通过#和选择器名称来定义，应用时为id=“选择器名称”。

声明声明

#id{color:red;font-size:50px;}

ID选择器名属性值属性值

?;2关联CSS

当解析CSS样式表时，浏览器会根据它来格式化HTML文档，关联样式表的方法有三种，分别是行内样式、内部样式和链接样式。

行内样式：在HTML元素内部通过style直接添加样式，如pstyle=color:red段落/p

内嵌样式：在头部使用style/style标签内部样式。

链接样式：也称外部样式表，总共包括两个文件，将样式与网页内容分开，有利于，在网页的头部使用linkrel=“stylesheet”type=“text/css”href=“mystyle.css”标签链接到样式表，可实现内容与样式的分离。;盒子通常包括内容（content）、填充（padding）、边框（border）、边界（margin），如图7-4所示。CSS盒子模式都具备这些属性，每个属性都有top、left、bottom和right4个方向。;;PART4;;PART5;;在微信的通信录中直接进入企业号。也可以通过下载微信企业APP加入，一起体验课后延伸学习的过程

进入“微加云学院”，选择课件内容再次学习、在线做练习题、考试。

进入“企微云项目”，查看并完成本章学习项目，查看项目，领取项目，登记项目进展情况，方便教师随时查看学生项目的完成进度。

进入“投票调研”“问卷星”，参与调查问卷互动，反馈教学效果。

进入“教学论坛”，下载本章素材或对相关知识点发贴、回帖互动。

进入“腾讯乐享”，通过知识库、问答、课堂、考试、活动、投票和论坛等核心应用，培训学习等多元化需求

进入“快课学堂”，通过主页型企业培训应用进行在线学习交流。;谢谢再见