文档介绍:思考题
使用学****过的知识实现如下网页效果:
将table中的所有单元格的文字颜色都设置为blue。
<table border="1">
<tr>
<td>单元格1</td>
<td>单元格2</td>
</tr>
<tr>
<td>单元格3</td>
<td>单元格4</td>
</tr>
</table>
<td><font color="blue">单元格1</font></td>
<td><font color="blue">单元格2</font></td>
<td><font color="blue">单元格3</font></td>
<td><font color="blue">单元格4</font></td>
<table border="1" style="color:blue">
层叠样式表(CSS)
1 CSS概述
2 为网页添加样式表的方法
3 用CSS定义样式
1 CSS概述
什么是CSS
CSS就是Cascading Style Sheets,中文翻译为“层叠样式表”,他是一项制作网页时专门管理样式的技术。(P-175)
作用:控制Web页面外观
例: 新浪网
东北石油大学
1 CSS概述
CSS的发展史
2009
1998
1997
1994
CSS建议被提出
CSS1作为标准颁布
CSS2标准颁布
CSS3版本颁布
1 CSS概述
第一个CSS程序
1、背景设置为yellow 2、表格居中对齐
3、文字居中对齐 4、表格宽度为700px
5、字号为18px
1 CSS概述
CSS带来的好处
便于页面风格的统一和修改
CSS
html
html
html
html
<link rel="stylesheet" href="CSS文件路径" type="text/CSS">
html
html
html
html
html
html
html
CSS1
CSS1的文件路径
1 CSS概述
2、表现和内容相分离
套用CSS样式文件
1 CSS概述
CSS带来的好处
CSS+div布局模式——提高页面浏览速度
页面加载中。。
2 为网页添加样式表的方法
将CSS引入HTML页的4种法
1、内嵌样式
混合在HTML标记里使用,对每个元素单独定义样式
语法:<标签 style="属性1:值1;属性2:值2……">
标签内容
</标签>
例: <p style="color:blue;font-size:10pt">
内嵌样式示例
</p>
2 为网页添加样式表的方法
将CSS引入HTML页的4种法
2、内部样式
在HTML的头部标签<head>与</head>之间添加样式
语法: 例:
<head>
<style type="text/CSS">
规则1
规则2
……
</style>
</head>
选择符{
属性1:属性值1;
属性2:属性值2;
}
……