Share tips.

tips.html

เริ่มต้นใช้เขียน CSS ร่วมกับ HTML

สนุกกับการใช้งาน CSS กับ HTML ซึ่งจะทำให้เว็บไซต์ของเรามีสีสันและสวยงานขึ้น ในตัวอย่างนี้ขอแนะนำการควบคุมการแสดงผล(เปลี่ยนสีแถว)ให้กับแท็ก td

ผลลัพธ์ที่ได้จากความสามารถของ CSS ที่ใช้ควบคุมแท็ก td จะแสดงผลได้ดังนี้

แถวที่ 1
แถวที่ 2
แถวที่ 3
แถวที่ 4

พอเรานำเม้าส์ไปวางบนแถวที่ x ก็จะเปลี่ยนเป็นสีแดงทันที

ต่อไปเป็นการควบคุมแท็ก img ให้มีความทึบหรือโปร่งใส

<style type="text/css">
	/* ลดความทึบหรือโปร่งใสลง (50%) */
	img       { opacity:0.5; filter:alpha(opacity=50);  }

	/* แสดงปกติ 100%  เมื่อนำเม้าส์ไป Over บนรูปภาพ*/
	img:hover { opacity:1; filter:alpha(opacity=100);}
</style>

เมื่อเรานำเม้าส์ไปวางบนรูปภาพๆ จะปรับความทึบหรือโปร่งใสเป็น 100%

นี่คือตัวอย่างย่อยซึ่งเราสามารถนำไปประยุกต์ใช้กับแท็ก html อื่นๆ ได้อีกมากมาย อาทิเช่น a, img, h1, h2, h3, h4, h5, h6, div, span, table, tr, td เป็นต้น

3 กุมภาพันธ์ 2555 14:20:37