理论教育 网页设计与制作:行内样式的使用与局限

网页设计与制作:行内样式的使用与局限

时间:2023-11-04 理论教育 版权反馈
【摘要】:行内样式是在XHTML标记中增加一个样式属性style,style属性的内容就是CSS的属性和值。但是,利用这种方法定义样式时,作用范围只可控制该标记。在XHTML标记中使用行内样式。--文件名:ex7-1.html--><!</p></body></html>显示结果如图7-3所示。但是,由于行内样式与需显示的内容混在一起,且在标记中用style属性一次只能设置一个标记的样式,效率低,也失去了样式表的优点,所以应尽量少用此方法。

网页设计与制作:行内样式的使用与局限

行内样式是在XHTML标记中增加一个样式属性style,style属性的内容就是CSS的属性和值。用这种方法,可以很简单地对某个标记单独定义样式。但是,利用这种方法定义样式时,作用范围只可控制该标记。格式为:

<标记style="属性:属性值;属性:属性值……">

说明:style属性可以应用于除basefont、param和script之外的任意body标记(包括body本身)。

【例7-1】在XHTML标记中使用行内样式。

在“记事本”等编辑窗口中输入下面的代码:

<!--文件名:ex7-1.html-->

<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type"content="text/html;charset=gb2312"/>

<title>火鸡的故事</title>

</head>(www.daowen.com)

<body>

<h3 style="text-align:center;font-size:16pt;font-family:'黑体';color:red">火鸡的故事</h3>

<h3 align="center">一只火鸡和一只公牛在聊天。</h3>

<p style="margin-left:2em;margin-right:2em;font-size:12pt;color:blue;background:yellow">“我非常想到那棵树顶上去,”火鸡叹气道,“但是我没有那份力气。”“这样啊,你为什么不吃点我的粪便呢?”公牛答道,“那里面充满了营养”。火鸡吃了一团粪便,发现它真的使自己有力气达到树的第一个分叉处。第二天,在吃了更多的牛粪后,火鸡达到了树的第二个分叉处。最终,两星期后,火鸡非常骄傲地达到树的顶端。但不幸的是,没多久,它就被一个农夫盯上了,并且农夫非常利索地就把火鸡射下来了。</p>

<p>这个故事告诉我们:牛粪(狗屎运)也许能使你达到顶峰,但它不能使你永远待在那儿。</p>

</body>

</html>

显示结果如图7-3所示。

图7-3 使用行内样式

从该例中可以看出,行内样式比其他方法灵活。但是,由于行内样式与需显示的内容混在一起,且在标记中用style属性一次只能设置一个标记的样式,效率低,也失去了样式表的优点,所以应尽量少用此方法。

免责声明:以上内容源自网络,版权归原作者所有,如有侵犯您的原创版权请告知,我们将尽快删除相关内容。

我要反馈