DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS詳解 >> DIV style常用屬性(4)
DIV style常用屬性(4)
編輯:CSS詳解     
33、border:設置DIV的邊框樣式。

例:

  1. <divstyledivstyle="border:dotted2pxblack;background-color:Yellow;width:100px;height:100px;">div>

說明:border後跟邊框的樣式、寬度、顏色等屬性。還可以用以下屬性分別設置。

34、border-width:設置邊框的寬度。

35、border-color:設置邊框的顏色。

36、border-style:設置邊框的樣式。

例:

代碼

  1. 1<labelstylelabelstyle="font-size:14px;">選擇樣式:label>
  2. 2
  3. 3<selectidselectid="bstyle"onchange="document.getElementById('tdd').style.
  4. 4
  5. 5borderStyle=this.options[this.selectedIndex].text;">
  6. 6
  7. 7<optionselectedoptionselected="selected">noneoption>
  8. 8
  9. 9<option>dashedoption>
  10. 10
  11. 11<option>dottedoption>
  12. 12
  13. 13<option>grooveoption>
  14. 14
  15. 15<option>hiddenoption>
  16. 16
  17. 17<option>insetoption>
  18. 18
  19. 19<option>outsetoption>
  20. 20
  21. 21<option>ridgeoption>
  22. 22
  23. 23<option>doubleoption>2425<option>solidoption>
  24. 26
  25. 27select>
  26. 28
  27. 29<dividdivid="tdd"style="border-style:none;
  28. border-width:5px;border-color:Black;width:100px;
  29. height:100px;background-color:Yellow;">
  30. 30
  31. 31div>

說明:border是對四個邊框同時進行設置。也可以單獨對某一邊或幾個邊進行設置,此時用以下屬性:

border-top:設置上邊框樣式。

37、border-bottom:設置下邊框樣式。

38、border-left:設置左邊框樣式。

39、border-right:設置右邊框樣式。

說明:某一邊框的某一樣式也可單獨設置,以上邊框為例可以用:border-top-style、border-top-width、border-top-color來分別設置,由於使用各border相同,所以不在舉例說明。

40、display:設置顯示屬性。其值有block、none。

41、float:設置DIV在頁面上的流向,其值有left(靠左顯示)、right(靠右顯示)、none。

50、background:設置DIV的背景樣式。

例:

  1. <divstyledivstyle="width:600px;height:200px;background:yellowurl(mw3.jpg)repeatscroll;
  2. overflow:auto">
  3. <divstyledivstyle="width:2px;height:1000px;">
  4. div>
  5. div>

說明:background後可直接跟背景的顏色、背景圖片、平鋪方式等樣式。也可以用以下屬性分別設置。

51、background-color:設置背景顏色。

52、background-attachment:背景圖像的附加方式,其值有scroll、fixed。

53、background-image:指定使有的背景圖片。

54、background-repeat:背景圖象的平鋪方式。其值有no-repeat(不平鋪)、repeat(兩個方向平鋪)、

repeat-x(水平方向平鋪)、repeat-y(垂直方向平鋪)。

55、background-position:在DIV中定位背景位置。其值有topbottomleftright的不同組合。也可以以用坐標

指定具體的位置。

例:

  1. <divstyledivstyle="background-color:Yellow;
  2. background-image:url(mw3.jpg);
  3. background-position:rightbot
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved