码迷,mamicode.com
首页 > Web开发 > 详细

CSS

时间:2014-11-09 12:30:30      阅读:249      评论:0      收藏:0      [点我收藏+]

标签:style   color   使用   sp   strong   文件   on   代码   bs   

CSS样式
    1.内联式CSS样式表:把CSS代码直接写在现有HTML标签中
         (1)<p style="color:red">这里是红色的字</p>
         (2)<p> 这里是红色的字</p style="color:red">
         注:CSS样式代码要写在style=""双引号中,如果右多条CSS样式代码设置可以写在一起,中间用分号隔开
              <p style="color:red" ; font-size:12px>这里是红色的12像素的字</p>
    2.嵌入式CSS样式表:把CSS代码写在<style type="text/css"></style>标签中间
             <style type="text/css">
                  span{
                          color:red;
                  }           
             </style>
             <body>
                    <span>这里是红色的字</span>
             </body>
    3.外部式CSS样式:把CSS写在单独的一个文件中
        在index.html文件中:      
                <link href="style.css" rel="stylesheet" type="text/css" />
                <body>
                    <span>这里是红色的字</span>
                </body>
        在style.css文件中 
                span{
                     color:red;
                }
       注:
          1.CSS样式文件名称以有意义的英文字母命名,如main.css
          2.rel="stylesheet" type="text/css"是固定写法不可修改
          3.<link>标签位置一般写在<head>标签之内
    三种方法的优先级:离修饰的内容距离越近越优先,就近原则

选择器
      选择器{
          样式
      }
      在{}之前的部分就是"选择器","选择器"指明了{}中的"样式"的作用对象,也就是"样式"作用于网页中的哪些元素

      标签选择器:html代码中的标签
           p{pont-size:12px; line-height:1.6em;}
              上面的p,就是一个p标签
  
      类选择器
           语法: .类选择器名称{CSS样式代码;}
               英文圆点开头
               名称可以随意起
           例:
              <style type="text/css">
                 .stress{
                      color:red;
                  }           
              </style>
              <body>
                 <span clss="stress"> 要修饰的文字</span>
              </body>

      ID选择器
            ID选择器类似类选择器,区别在于
              1.为标签设置id="ID名称",而不是class="类名称"
              2.ID选择符的前面是#,而不是.
            例:
              <style type="text/css">
                 #stress{
                      color:red;
                  }           
              </style>
              <body>
                 <span id="stress"> 要修饰的文字</span>
              </body>
      注:ID选择器在文档中只能使用一次,
          可以用类选择器词列表方法为一个元素同时设置多个样式,ID选择器却不可以
          例:
            
.stress{
                   color:red;
              }
              .bigsize{
              font-size:25px;
             }
             <p>到了<span class="stress bigsize">三年级</span>下学期时,我们班上了一节公开课...</p>

 

 

         

CSS

标签:style   color   使用   sp   strong   文件   on   代码   bs   

原文地址:http://www.cnblogs.com/zsboy/p/4084726.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!