one piece

定义内部样式表

在HTML文件内定义样式表
在标记中,用设置STYLE属性的方法,只能控制一个标记的样式,实在让人看不出CSS对网页设计有什么特别的效果,在这一节,将告诉您如何在

  1. <style>

元素(Element)中定义样式,在整个html文件中,要使用该样式的标记可以直接调用。下面是

  1. <style>

元素的定义语法:

  1. <style type="text/css">
  2.  <!--
  3.  选择符1 {样式属性:属性值; 样式属性:属性值;}
  4.  /*注释内容*/
  5.  选择符2 {样式属性:属性值; 样式属性:属性值;}
  6.  ........
  7.  选择符N {样式属性:属性值; 样式属性:属性值;}
  8.  -->
  9.  </style>


style元素是用来说明所要定义的样式。type属性是指定style元素以CSS的语法定义。当然您也可以指定像JavaScriPt类的语法来定义。在这里将针对CSS进行介绍。下面是语法各部分的说明。\r

  1. <!--.....-->

隐藏标记。避免因浏览器不支持CSS语言,而导致错误。加上次标记后,不支持CSS的浏览器,会自动略过此段内容,避免错误。\r

  1. 选择符1.......选择符N

在这里选择符(SElector)可以使用HTML标记的名称,所以HTML标记都可以做为CSS选择符。\r

  1. 样式属性

定义样式的属性名称。\r

  1. 属性值

设置样式属性的值。\r

  1. /*....*/

注释符号,在CSS里,包含在这两个符号中的内容,主要用与解释内容并不会显示或被引用在网页上。加上注释主要是帮助别人与自己阅读,以及方便日后做修改。\r —————————————-
选择符! ?
选择符这个名字听起来让人有点困惑。其实选择符就是某一个样式的名称,之所以会称为选择符*(Selector),愿意是当html文件中某原色要使用该样式时,就必须利用该名称选择样式。在本教材中。使用选择符这个名词的原因,是为了配合W3C标准,其实您可以直接把它当成样式名称,相信这样会比较好理解。\r —————————————-
范例1-2.htm将利用style元素,把CSS内h1与h2选择符的样式分别定义为”楷体、红色“与华文隶书、蓝色”。而

  1. /*....*/

符号内包含的文字将不会引用或显示在网页中。\r

  1. <style type="text/css">
  2.  <!--
  3.  H1 {font-family:楷体; color:red}
  4.  /*引用H1样式时,字体将为红色楷体*/
  5.  H2 {font-family:华文录书; color=blue}
  6.  /*引用H2样式时,字体将为蓝色华文隶书*/
  7.  -->
  8.  </style>

范例1-2.htm:定义内部样式,如图所示\r

图fl1-2

程序说明
在程序第4-10行,我们利用style元素分别在第6行和第8行,定义了CSS的h1与h2选择符的样式。在标记内提到font-family即为样式属性;楷体为属性值。\r 执行结果如图fl1-2-1所示。\r
图fl1-2-1

Created By: sb123

Form Page: 定义内部样式表


Leave a Reply


必须填写