大漠駝鈴

          置身浩瀚的沙漠,方向最為重要,希望此blog能向大漠駝鈴一樣,給我方向和指引。
          Java,Php,Shell,Python,服務(wù)器運維,大數(shù)據(jù),SEO, 網(wǎng)站開發(fā)、運維,云服務(wù)技術(shù)支持,IM服務(wù)供應(yīng)商, FreeSwitch搭建,技術(shù)支持等. 技術(shù)討論QQ群:428622099
          隨筆 - 238, 文章 - 3, 評論 - 117, 引用 - 0
          數(shù)據(jù)加載中……

          CSS 學(xué)習(xí)之一 選擇符

          選擇符就是一系列的模式,只要頁面上有完全匹配這個模式的元素存在,樣式就會自動應(yīng)用到該元素上。比如P,h1等就是一個簡單的元素。

          Css語法:
          一個簡單的選擇符包含一個通用的選擇符或是一個類型選擇符,它的后面跟有0個或者多個id選擇符、屬性選擇符或者偽類,三者順序可以任意。

          一個選擇符可以由一個或者多個簡單的選擇符構(gòu)成,中間用連接符相隔。

          連接符可以是(空白,大于號> 加號+)

          基本的選擇符:

          1 通用的選擇符
          *{
          background-color
          :red;
          }

          * .title
          {
          border
          :1px solid;
          }

          .title
          {

          border
          :1px solid;
          }
          類型選擇符:(一般為html元素的名稱)
          h1{
          font-size
          :9em;
          color
          :#999FFF;
          }

          p
          {
          margin
          :0;
          border
          :2px solid;
          }
          組選擇:

          h1{
          font-size
          :10px;
          color
          :#999;
          }

          h2
          {
          font-size
          :10px;
          color
          :#999;
          }

          p#title
          {
          font-size
          :10px;
          color
          :#999;
          }

          #hutitle
          {
          font-size
          :10px;
          color
          :#999;
          }

          上面的可以用以下組選擇符來代替(中間用(,)來區(qū)分)

          h1,h2,p#title,#hutitle
          {
          font-size
          :10px;
          color
          :#999;
          }

          id(#) 和 class(.) 選擇符

          1 id 選擇符
          id 是唯一的,可以唯一的標(biāo)識一個元素。
          <h1 id="h1Title">開學(xué)通知</h1>
          <id="pContent">請同學(xué)們先到教務(wù)處來報道</p>
          <h1 id="h2Title">開課通知</h1>
          <id="p2Content">好好學(xué)習(xí)Css</h2>

          h1#h1title{
          color
          :white;
          background-color
          :silver;
          }
          p#pContent
          {
          color
          :yellor;
          background-color
          :maroon;
          }



          只改變特定的元素。

          class 選擇符

          class屬性不要求唯一而id屬性要求唯一,多個元素可以共享一個class的值,而且多個元素可以設(shè)置多個class的值.

          <h1 id="h1Title" class="h1Title">開學(xué)通知</h1>
          <id="pContent" class="pContent">請同學(xué)們先到教務(wù)處來報道</p>
          <h1 id="h2Title" class="h2Title">開課通知</h1>
          <id="p2Content" class="pContent">好好學(xué)習(xí)Css</h2>
          <p >每天學(xué)習(xí)一章節(jié),早點把css學(xué)會</h2>

          h1.h1Title{
          color
          :white;
          background-color
          :silver;
          }
          p.pContent
          {
          color
          :yellor;
          background-color
          :maroon;
          }

          h1.h2Title
          {
          color
          :red;
          }




          多重class
          id 屬性是唯一的,class屬性是多對多的關(guān)系,同一個class也可賦給多個元素,一個html可以有多個相同的class。
          <href="class1 class2" href="/">鏈接</a>

          a.class1{
          font-size
          :12px;
          }
          a.class2
          {
          color
          :red;
          }

          上面這種css會對所有屬于class1或者class2的a元素進行作用,而如果只對同時對class1 class2的a元素有作用只能是下面的方式
          a.class1.class2{
          color
          :red;
          }
          或者

          a.class2.class1
          {
          color
          :red;
          }

          是選擇class還是選擇id?

          如果是給任意數(shù)量、任意類型的元素指定class屬性,而一個id屬性值只能賦值給唯一的元素。




          posted on 2010-03-10 17:23 草原上的駱駝 閱讀(247) 評論(0)  編輯  收藏 所屬分類: CSS


          只有注冊用戶登錄后才能發(fā)表評論。


          網(wǎng)站導(dǎo)航:
           
          主站蜘蛛池模板: 韶山市| 库伦旗| 沁水县| 河东区| 元氏县| 芷江| 汝南县| 桃源县| 渭南市| 五大连池市| 双江| 珲春市| 衡南县| 老河口市| 高碑店市| 甘孜| 汾西县| 克山县| 贺兰县| 通辽市| 图片| 大理市| 闽侯县| 石嘴山市| 什邡市| 来安县| 南投县| 阳东县| 岱山县| 布拖县| 和林格尔县| 佛学| 集贤县| 海丰县| 阜康市| 旅游| 多伦县| 长丰县| 安丘市| 临海市| 尉氏县|