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

HTML/XHTML教程
XHTML中不再使用HTML中的一些废弃元素
语义化的HTML结构怎么理解
Web 标准学习 理解结构和表现相分离
html5 标签
HTML5 新事件 小结
HTML5 b和i标记将被赋予真正的语义
HTML是网页制作者必须要学习掌握的
HTML DOCTYPE的缩写
Readonly和Disabled的区别
16进制颜色代码(完全)
H标记要在网页制作中合理使用
abbr标记和acronym标记
知名浏览器对DOCTYPE模式的选择机制
用标准dl,dt,dd标签抛弃table列表
html 标签ID可以是变量
iframe 自适应大小实现代码
HTML5 解析规则分析
HTML减肥 精简HTML标记制作网页
HTML5 File API改善网页上传功能
HTML 5 Reset Stylesheet

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-04   浏览: 89 ::
收藏到网摘: 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的浏览器可以忽略样式表。