欢迎来到天天文库
浏览记录
ID：50468106
大小：526.00 KB
页数：27页
时间：2020-03-09
《网页前端技术-电子教案-王敏杰 模块二任务一.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。
1、②模块二CSS语言CSS任务一认识CSS案例分解案例资讯我的第一个CSS文件CSS概念CSS的使用教学重点：CSS的基本概念CSS的特点教学难点：CSS的类型CSS的基本写法案例资讯案例一我的第一个CSS文件1、CSS的基本概念2、CSS的特点3、使用CSS的好处一、CSS概念1、CSS的基本概念CSS，中文译作“层叠样式表单”(CascadingStyleSheet)是一系列格式规则，它们控制网页内容的外观。使用CSS样式可以非常灵活并更好地控制确切的网页外观，从精确的布局定位到特定的字体和样式。CSS可以完成下列工作：(1)弥补HTML对网页
2、格式化功能的不足，如段落间距、行距等。(2)设置字体变化和大小。(3)设置页面格式的动态更新。(4)进行排版定位。2、CSS的特点a、将格式和结构分离，减少工作量b、以前所未有的能力控制页面布局c、制作体积更小、下载更快的页面d、将许多页面同时更新，比以前更快更容易e、浏览器将成为更友好的界面,对HTML语言处理样式的最好补充f、控制页面中的每一个元素（精确定位）3、使用CSS的好处①样式解决了一个普遍的问题HTML标签原本被设计为用于定义文档内容。通过使用
、
3、、“这是表格”之类的信息。同时文档布局由浏览器来完成，而不使用任何的格式化标签。②多重样式将层叠为一个样式表允许以多种方式规定样式信息。样式可以规定在单个的HTML元素中，在HTML页的头元素中，或在一个外部的CSS文件中。甚至可以在同一个HTML文档内部引用多个外部样式表。优先权浏览器缺省设置外部样式表内部样式表（位于
4、将之应用于你希望的任意多的页面中。如需进行全局的更新，只需简单地改变样式，然后网站中的所有元素均会自动地更新。二、CSS的使用1、CSS的类型a、自定义CSS，相应的标记中出现“class"属性.bg{backgroudn-image:url(bg.gif);}在HTML中使用：b、重定义标记的CSStd{color:#000099;font-size:9pt;}c、CSS选择符使用“ID”作为属性，以保证文档具有唯一可用的值CSS选择符是一种特殊类型的样式，常用的有4种a:link、a:active、a:visi
5、ted、a:hovera:link：a:active：a:visited：a:hover：设定正常状态下链接文字的样式。设定鼠标单击时链接的外观。设定访问过的链接外观。设定鼠标放置在链接文字之上时文字的外观。a:link{color:#FF3366;font-family:”宋体”;text-decoration:none;}A:hover{color:#FF6600;font-family:”宋体”;text-decoration:underline;}A:visited{color:#FF339900;font-family:”宋体”;tex
6、t-decoration:none;}代码如下：2、CSS的基本写法①、在HEAD内实现，即
7、式在浏览器中被解析有先后顺序，就会有一个规则来约定这个先后顺序。在CSS中的这个规则如下：①统计选择符中的ID属性个数。②统计选择符中的CLASS属性个数。③统计选择符中的HTML标记名个数。例如：每个ID选择符(#someid)，加0,1,0,0。每个class选择符(.someclass)、每个属性选择符(形如[attr=value]等)、每个伪类(形如:hover等)加0,0,1,0。每个元素或伪元素(:firstchild)等，加0,0,0,1。其它选择符包括全局选择符*，加0,0,0,0。相当于没加，不过这也是一种specificity
8、，后面会解释。下表是一个按特性分类的选择符的列表：选择符特性值h1{color:blue;}1pem{color:purple;}2.a
此文档下载收益归作者所有
