您现在的位置: 湖南软件学院CRP网站群 >> 学院动态 >> 软件技术 >> 新闻正文
来源:希赛网 点击: 添加时间:2007-12-12 13:58:49
精通Web标准网页布局:级联样式表的语法


  级联样式表语法结构如下。

  选择符{属性1:属性值1; 属性2:属性值2;…}
  关于样式表的语法,要注意以下几个问题。
  *     属性必须要包含在{}号之中。
  *     属性和属性值之间用“:”分隔。
  *     当有多个属性时,用“;”进行区分。
  *     在书写属性时属性之间使用空格换行等,并不影响属性的显示。
  *     如果一个属性有几个值,则每个属性值之间用空格分隔开。
  其中语法中关于选择符、属性、值等概念,将在以下的几节中做详细介绍。

  通过前面讲解的知识可以知道,级联样式表除了使用class属性引用之外,还可以使用style属性在元素中直接定义。此时的使用的语法如下。
  <元素名称 style="属性1:属性值1; 属性2:属性值2;…"></元素名称>

  注意:在W3C制定的Web标准中,并不推荐在元素中直接定义样式表。

  下面是一个使用样式表的实例。其代码如下。
  例程13-2  css-show.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>CSS实例页面</title>
  <style>
  .content{
    margin:50px auto;
    height:200px;
            width:300px;
            border:10px solid #333333;
            background:#666666;
            color:#ffffff;
            line-height:200px;
            text-align:center;
            font-size:36px;
          font-weight:bold;
          text-decoration:line-through;}
  </style>
  </head>
  <body>
  <div>
   <div class="content">
         使用CSS的实例</div></div>
    </body>
    </html>

    其代码运行后,显示效果如图所示。


新闻录入:ics_jp 责任编辑:信息化中心

湖南软件职业学院信息化中心 Ver.2007© 美工:刘国鹂 程序:杨小刚
学院地址:长沙市天心区新开铺路1186号  电话:0731-6938121(传真) 6938122