自定义CSS的三中方方式:
一、行间样式表
行间样式表是指将CSS样式编码写在HTML标签中,格式如下
<h1 style="font-size:12pxcolor:#000FFF">我的CSS样式。
</h1>
行间样式表由HTML元素的HTML元素的style支持,只需将CSS代码用分号隔开写在style=""之中。这是最基本的形式,但是它没有实现表现与内容分离且不能灵活的控制多个页面所以我们只是在调试CSS代码的时候使用。
二、内部样式表
内部样式表与行间样式表相似都是把CSS代码写在HTML页面中,稍微不同的是前者可以将样式表放在一个固定的位置,格式如下
<html><head>
<title>内部样式表</title>
<style type="text/css">
h1{font-size:12px
color:#000FFF
}
</style>
</head>
<body>
<h1>我的CSS样式。</h1>
</body>
</html>
内部样式表编码是初级的应用形式,不能达到跨页面使用所以不适合使用。
三、外部样式表
外部样式表是CSS应用中最好的一中形式,它将CSS样式代码单独放在一个外部文件中,再由网页进行调用。多个网页可以调用一个样式文件表,这样能够实现代码的最大限度的重用及网站文件的最优化配置,格式如下
<html><head>
<title>外部样式表</title>
<link rel="stylesheet" rev="stylesheet" href="style.css">
</head>
<body>
<h1>我的CSS样式。</h1>
</body>
</html>
在style.css中的代码为
h1{font-size:12pxcolor:#000FFF
}
我们在<head>中使用了<link>标签来调用外部样式表文件。将link指定为stylesheet方式,并使用了href="style.css"指明样式表文件的路径便可将该页面应用到在style.css中定义的样式。
有三种方法可以在站点网页上使用样式表:1、外部样式:将网页链接到外部样式表。
2、内页样式:在网页上创建嵌入的样式表。
3、行内样式:应用内嵌样式到各个网页元素。
每一种方法均有其优缺点:
当要在站点上所有或部分网页上一致地应用相同样式时,可使用外部样式表。在一个或多个外部样式表中定义样式,并将它们链接到所有网页,便能确保所有网页外观的一致性。如果人们决定更改样式,只需在外部样式表中修改一次,而该更改会反映到所有与该样式表相链接的网页上。通常外部样式表以 .css 做为文件扩展名,例如 Mystyles.css。然后在需要此样式的页面中将其链接进来,如:
<link href="/css/Mystyles.css" rel="stylesheet" type="text/css"/>
当人们只是要定义当前网页的样式,可使用嵌入的样式表。嵌入的样式表是一种级联样式表,“嵌”在网页的 <HEAD>标记符内。嵌入的样式表中的样式只能在同一网页上使用。 如:
<style type="text/css">
<!-- /* 把声明的样式包含在一个html注释中,这样可以解决较老的浏览器不识别style的问题 */
body {background:grey}
-->
</style>
使用内嵌样式以应用级联样式表属性到网页元素上。 如:
<pstyle="@import url('style3.css')">CSS document</p>
<!-- 不能在style属性中使用@import -->
如果网页链接到外部样式表,为网页所创建的内嵌的或嵌入式样式将扩充或覆盖外部样式表中的指定属性。
要在网页上使用外部样式表的样式,可将该网页链接到样式表,方法是使用位于 “格式” 菜单上的 “样式表连接” 命令。可以链接一个或数个样式表到网页视图模式下的当前网页,或到在文件夹列表中的所选网页,或到站点上的全部网页。
该“样式” 框列出标准 HTML 标记符,例如标题
1,还有嵌入的样式表或链接到网页的外部样式表中所含的类或 ID 选择器。要应用样式到网页元素,请选定该样式然后单击 “样式” 框中的样式或选择器。
在 Microsoft FrontPage 2000中,某些格式设置特性会作为内嵌样式自动应用。例如∶如果使用 “边框与阴影” 命令(在 “格式” 菜单上)在普通段落周围应用框,FrontPage 会写下格式设置信息,作为段落标记符的内嵌样式属性(例如∶ <p style="border-style: solid">)。然而某些属性的应用需要使用 CSS,其他则需要使用 HTML 。如果人们只想使用 CSS 应用内嵌样式,可使用 “样式” 按钮(位于网页元素的 “属性” 对话框里)应用类或 ID 选择器或嵌入式样式。