透過<img>標記的border屬性值則是為圖片新增邊框及粗細,當設置為0時,則顯示"無邊框"。例: <img src="/public/images/ch03/pic.jpg" border=0> <img src="/public/images/ch03/pic.jpg" border=1> <img src="/public/images/ch03/pic.jpg" border=2> 透過border-style可以定義邊框的各種樣式。例: <style type="text/css"> img.pic1 { border-style:dotted; /* 點畫線 */ border-color:#FF9900; /* 邊框顏色 */ border-width:4px; /* 邊框粗細 */ } img.pic2 { border-style:dashed; /* 虛線 */ border-color:#000088; /* 邊框顏色 */ border-width:6px; /* 邊框粗細 */ } </style> <img src="/public/images/ch03/pic.jpg" class="pic1"> <img src="/public/images/ch03/pic.jpg" class="pic2"> 圖片混排是透過float屬性來實現文字環繞圖片。例: <style type="text/css"> img{ float: right; /* 文字環繞圖片 */ } </style> <img src="/public/images/ch03/pic.jpg" border="0"> <p>請加入一堆有的沒的文字吧!!</p> <p>請加入一堆有的沒的文字吧!!</p> <p>請加入一堆有的沒的文字吧!!</p> <p>請加入一堆有的沒的文字吧!!</p> |
B05.HTML 5, jQuery, Facebook & GWT > 04.CSS >