当前位置: 首页 > 图文教程 > 网页制作 > HTML/XHTML教程 > 式样单的例子

HTML/XHTML教程
CSS 循序渐进(四)表里春秋
精通 CSS 滤镜(五)
让css使网页图片半透明
实现页面图片阴影特效
发现CSS控件的好处
用CSS缩写给你的网站加速
CSS在IE和Nascape的显示差别
利用CSS,不通过replace替换标引HTML标记
拒绝单调 让网页超链接拥有多姿多彩的下划线
对CSS类及id的规范化命名
利用css里expression来实现界面对象的批量控制
利用CSS控制打印
第一章 CSS的基本认识
第二章 CSS的应用方式
第三章 CSS的应用补充
第四章 颜色背景的CSS
第五章 文字性质的CSS
第六章 区块性质的CSS
HTML之其他标记
HTML之链接标记

HTML/XHTML教程 中的 式样单的例子


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-04   浏览: 81 ::
收藏到网摘: n/a

=====================================

你好!朋友,欢迎光临Java2000的教学区。
Hello,everybody,welcome in java2000 !
==========================================

产生以上效果的HTML源代码是这样的:

<html>
<head> 
<style type="text/css">
<!--
h2 { font-family: "宋体"; font-size: 12pt; font-style: italic; color: #FF0033; background-color: #FFCCCC}
h1 { font-family: "Arial"; font-size: 12pt; color: #66FF66}
-->
</style>
</head>
<body>
<h2>你好!朋友,欢迎光临Java2000的教学区。</h2>
<h1>Hello,everybody,welcome in java2000 !</h1>
</body>
</html> 

下面做一些简单的说明:
(1)在黄色的CSS语法规则中这样定义了文字的风格,标签<h2>...</h2>间的字符为“宋体”,“大小12pt”,字符是“倾斜”的,颜色“#ff0033”,字符背景色“#ffcccc”。同理,标签<h1>...</h1>之间的文字字体“arial”,大小“12pt”,颜色“#66ff66”。

(2)上面的CSS格式里,h1和h2称为“选择对象”,font-size以及color等称为“属性”,属性后面的称为“参数”。

(3)通过css可以控制任何HTML标签的风格。例如<td>,<p>,<body>,<table>,<tr>,<th>等。只要在HTML的<head>区内的<style type="text/css">和</style>之间指定对应标签的风格(字体,颜色,字体大小)即可,使用“宋体的9磅字体”可非常的好看啊,许多站用的都是9pt的字体。

(4)如果你需要定义的一些标签的风格相同,可以这样做,将他们写在一起,这样又可以减少代码了:

H1, P, TD{ font-family: arial ; font-size: 12pt}

上面的代码表示:所有位于<H1>、<P>和<TD>标签内的字符将用Arial字体,12pt显示。

(5)通过CSS设置的风格对于javascripts输出的结果也是有效的。你可以看看javascripts脚本区的一些显示日期和当前时间脚本的例子,为了有效地控制输出的字符大小,我都使用了CSS。

(6)注意:有的比较老的浏览器并不支持式样单语法,会将<style type="text/css">...</style>间的文本显示出来,若要避免这种情况的发生,最好加入<!-- 和 -->。这一点与javascripts相同。

(7)在<style type="text/css"> 中的 TYPE="text/css" 的作用是设定采用何种MIME类型,浏览器在执行到这里就知道了,这样以来,不支持CSS的浏览器可以忽略样式表。