การจัดแต่งเพจด้วย CSS (Internal) คือการประกาศคำสั่งใน HTML เพื่อทำให้ให้ Tag HTML สามารถแสดงผลโดยไม่ต้องประกาศซ้ำหลายครั้งในหน้าเดิม วิธีทำเริ่มจากเขียนสคริป CSS ไว้ที่ส่วนของ <head></head> ดังนี้
โค้ด: เลือกทั้งหมด
<head>
<style type="text/css">
</style>
</head>
ในหัวข้อนี้จะแชร์เรื่องของการปรับแต่งตัวอักษร ดังโค้ด Ex.1
Ex.1
โค้ด: เลือกทั้งหมด
<style type="text/css">
h1 {color:blue;}
h2 {color:green;}
</style>
จากนั้นลองทำการนำมาแสดง ดังโค้ด Ex.2
Ex.2
โค้ด: เลือกทั้งหมด
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
h1 {color:blue;}
h2 {color:green;}
</style>
</head>
<body>
<h1>H1</h1>
<h2>H2</h2>
<h2>H2</h2>
<h1>H1</h1>
</body>
</html>
OutPut
- CSS_Internal.png (2.27 KiB) Viewed 951 times
จะสังเกตุได้ว่าประกาศเพียงครั้งเดียวสามารถเรียกใช้ได้ตลอดในหน้านั้น ๆ
[size=150]การจัดแต่งเพจด้วย CSS (Internal)[/size] คือการประกาศคำสั่งใน HTML เพื่อทำให้ให้ Tag HTML สามารถแสดงผลโดยไม่ต้องประกาศซ้ำหลายครั้งในหน้าเดิม วิธีทำเริ่มจากเขียนสคริป CSS ไว้ที่ส่วนของ <head></head> ดังนี้
[code]
<head>
<style type="text/css">
</style>
</head>
[/code]
ในหัวข้อนี้จะแชร์เรื่องของการปรับแต่งตัวอักษร ดังโค้ด Ex.1
Ex.1
[code]
<style type="text/css">
h1 {color:blue;}
h2 {color:green;}
</style>
[/code]
จากนั้นลองทำการนำมาแสดง ดังโค้ด Ex.2 :)
Ex.2 :-o
[code]
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
h1 {color:blue;}
h2 {color:green;}
</style>
</head>
<body>
<h1>H1</h1>
<h2>H2</h2>
<h2>H2</h2>
<h1>H1</h1>
</body>
</html>
[/code]
OutPut
[attachment=0]CSS_Internal.png[/attachment]
จะสังเกตุได้ว่าประกาศเพียงครั้งเดียวสามารถเรียกใช้ได้ตลอดในหน้านั้น ๆ :-D