css初步

CSS 層疊樣式表:
 將網頁中的樣式分離出來,完全有CSS來控制.增強楊思的複用性及可擴展性.

 格式:
  選擇器{屬性名:屬性值;...}
 
 一、css和html代碼結合的四種方式:
 1,每一個html標籤都有個style屬性.
 2,當頁面有多個標籤有相同樣式時,可以進行復用,在html的head部分定義style標籤,並嵌入css帶按摩.
  <style>
   css代碼.
  </style>
 3,當有多個頁面中的標籤有相同樣式時,可以講樣式單獨封裝成一個css文件,通過在每個頁面中定義:
  <style>
   @import url("1.css");
  </style>
  將css文件加載到頁面.
 4,通過html中的head標籤中的link標籤連接一個css文件.
  <link rel=""stylesheet href="1.css" />
  使用技巧:可以講多個css樣式(文件)加載到一個css文件(如:manage.css)中,只要在html頁面中加載這個manage.css即可.可以直接對這個css文件進行管理,而不需要調整html代碼.
  例如: 有兩個樣式表:a.css, b.css.
   在html中加載1.css即可,而1.css只需要導入這兩個文件.
   @import url("a.css")
   @import url("b.css")
  
 二、選擇器:css樣式作用的標籤容器.
  當樣式分離後,html作用在於用標籤封裝數據,然後將css加載進來租用於指定標籤上.

  (一)選擇器的分類:
  1,標籤選擇器:就是html中的每一個標籤名.
  2,類選擇器:就是每一個標籤中的class屬性,用.的形式來標示.
   只對css所使用,可以給不同的標籤盡心相同的樣式設定.
  3,ID選擇器:其實就是每一個標籤中的ID屬性,但是要保證ID的唯一性,用#來標示.
   ID屬性不僅可以被css使用,還可以被javascript使用.
  
  選擇器的優先級:ID>class>標籤.

  (二)擴展選擇器:
   1、關聯選擇器:就是對標籤中的標籤進行樣式定義.
    格式:選擇器 選擇器 ...
   2、組合選擇器:對多個選擇器進行相同的樣式定義,將多個選擇器通過,隔開.
   3、爲元素選擇器:其實就是元素的一種狀態.
    a:link——超鏈接被點前的狀態.
    a:visited——超鏈接點擊後的狀態.
    a:hover——鼠標懸停在超鏈接上的狀態
    a:active——點擊超鏈接時.
    p:first-letter——首字母
    P:first-line——首行
    :focus——獲得焦點時.

   css濾鏡:通過一些代碼豐富了樣式.

   css幫助文檔.

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章