第9章 CSS样式使用
- 格式:ppt
- 大小:744.50 KB
- 文档页数:47


参考文档结构:练习2:用shadow属性和“:first-letter”为文本添加入下图所示阴影效果原始文本:章节第1章学习HTML5第2章HTML5标记第3章HTML5插入图片详细内容HTML的发展HTML5的新增功能如何学习HTML5效果图:练习3:使用letter-spacing 、word-spacing设置不同的字间距、字母间距,观察其效果参考效果图:练习4:换行处理利用word-wrap 或word-break 实现单词换行处理,观察其效果并总结两者区别默认效果:换行效果1:换行效果2:练习5:文档空格处理white-space利用white-space属性,控制段落文本中空格的显示效果原始文本:<p class="whitespace">This is some text. This is some text. This is some text.This is some text. This is some text. This is some text.This is some text. This is some text. This is some text.This is some text. This is some text. This is some text.This is some text. This is some text. This is some text.This is some text. This is some text. This is some text.</p>效果1:不换行效果2:保留所有空格。
第二章网页样式CSS总结一、CSS的概念与作用Css全称为级联样式表(Cascading Style Sheet),通常又称为风格样式表(Style Sheet),是用来进行网页风格设计的。
通过设立样式表,可以统一控制HTML中各标签的显示属性。
CSS可以更有效地控制网页外观。
使用CSS,可以精确的定位网页元素的位置,美化网页外观。
一个合理的CSS,还能有效地节省网络带宽,提高用户体验。
同时,使用CSS制作网页,还有以下优点:1、内容与表现分离。
有了CSS,网页的内容(XHTML)与表现就可以分开了。
2、表现统一。
可以使网页的表现非常统一,并且容易修改。
3、丰富的样式。
使得页面布局更加灵活。
4、减少网页的代码量,增加网页的浏览速度,节省网络带宽。
5、运用独立于页面的CSS,还有利于网页被搜索引擎收录。
二、<div>标签<div>标签可以用于定义HTML文档中的分区或节,即可以把HTML文档分割为独立的、不同的部分。
<div>标签就像一个容器,可以放置其他的HTML标签,如段落,列表,图片,表单等。
CSS的基本语法结构:<style type>=“text/css”>选择器{属性:属性值;......}</style>选择器:表示被修饰的对象,如页面中被修饰的段落标签<p>、列表标签<li>等。
属性:希望改变的样式,如颜色color、字体大小font—size 等,属性和属性值用冒号(:)隔开。
例如,设置页面中所有的<li>标签的文字颜色为红色,字体大小为15px,对应的样式代码如下:<style type=“text/css”>Li{color:#ff0000;font—size:15px;}</style>三、CSS选择器:根据选择器表示所修饰的内容类别,选择器又分为标签选择器、类选择器、ID选择器、并集选择器和后代选择器。