PHP Ionic Angular Phonegap AJAX Javascript CSS MySQL jQuery Forum


สร้างปุ่มแบ่งหน้าให้ดูดีด้วย css อย่างง่าย

29 October 2008 By
css แย่งหน้า

คำสั่ง การ กำหนด รูปแบบ ตัวอย่าง เทคนิค ลูกเล่น การประยุกต์ การใช้งาน เกี่ยวกับ css แย่งหน้า



 <style type="text/css">
  .mynavi{
  	display:block;
	width:25px;
	height:20px;
	text-align:center;
	text-decoration:none;margin-right:3px;
	background-color:#99CC33;
	color:#FFFFFF;
	float:left;
	font-size:12px;
	line-height:20px;	
  }
    .mynavi:hover{
  	display:block;
	width:25px;
	height:20px;
	text-align:center;
	text-decoration:none;margin-right:3px;
	background-color:#000000;
	color:#FFFFFF;
	float:left;
	font-size:12px;
	line-height:20px;	
  }
  .pgnavi{
  	display:block;
	height:25px;
	font-size:12px;
	line-height:20px;
	float:left;
	margin-right:3px;
  }
  </style> 

<div>
  <span class="pgnavi">Page: </span>
<a class="mynavi" href="#">1</a>
<a class="mynavi" href="#">2</a>
<a class="mynavi" href="#">3</a>
<a class="mynavi" href="#">4</a>
<a class="mynavi" href="#">5</a>
<a class="mynavi" href="#">6</a>
</div>

ตัวอย่างผลลัพธ์

Page: 1 2 3 4 5 6






Tags:: แย่งหน้า css






อย่าลืมกด Like กด Share เป็นกำลังใจ ในการสร้างบทความใหม่ๆ น่ะครับ


URL สำหรับอ้างอิง