2009/Jun/05

เป็นคำสั่งการใช้งาน css ที่เรามักใช้กันเป็นประจำ 
- กำหนดตำแหน่งในแนวตั้งด้วย  line-height

  line-height:10px; 

เมื่อเราต้องการให้ container จำกัดความสูงเราสามารถใช้ line-height เผื่อกำหนดให้ข้อมูลใน container อยู่ตรงกลาในแนวตั้ง

มาดูตัวอย่างกัน

Output เป็นการสร้าง paging style อย่างง่ายสามารถปรับเปลี่ยนได้ตามต้องการ


>> ดูตัวอย่าง<<



 Css


.page-control a {
font-size:12px;
line-height:20px;
font-family:Trebuchet MS;
text-decoration: none;
margin:0;
border: 1px solid #fff;color: #fff;
background-color: #434343;
font-weight: bold;
float:left;
width:20px;
margin-right:4px;
display:block;
padding-left:5px;
}
.page-control a.active ,.page-control a:hover {
background-color: #00DCFF; color: #000;
}
.page-control a:focus,.page-control a:active {
outline: none;
}

  Html

  <div class="page-control">
<a href="#">1a>
<a href="#">2a>
<a href="#">3a>
<a href="#">4a>
<a href="#">5a>
<a href="#">6a>
<a href="#">7a>
div>

 

 

Comment

Comment:

Tweet


มี tool ที่เอาไว้ช่วยเขียน css มะ
#1 by xnanoob At 2009-06-06 03:21,

snippet.googalz.com
View full profile