Lv.8 HTML Style

HTML Style เป็นการเพิ่มสไตล์ให้กับอิลิเมนต์ต่างๆของ HTML เช่น สี แบบอักษร ขนาด พื้นหลัง และอื่นๆ

Syntax:

<ชื่อแท็ก style="property:value">

property และ value ใช้แบบเดียวกันกับภาษา css นะครับ

HTML Style เปลี่ยนสีพื้นหลัง ใช้ background-color

ตัวอย่าง

<body style="background-color:blue;">
<h1 style="background-color:green;">This is a heading</h1>
<p style="background-color:gold;">This is a paragraph.</p>

เปลี่ยนสีตัวอักษร ใช้ color

ตัวอย่าง

<h1 style="color:red;">หัวเรื่อง</h1>
<p style="color:blue;">ย่อหน้า</p>

รูปแบบตัวอักษร ใช้ font-family

ตัวอย่าง

<h1 style="font-family:Times New Roman;">หัวเรื่อง</h1>
<p style="font-family:sans-serif;">ย่อหน้า</p>

ขนาดตัวอักษร ใช้ font-size

ตัวอย่าง

<h1 style="font-size:36px;">หัวเรื่อง</h1>
<p style="font-size:14px;">ย่อหน้า</p>

จัดตำแหน่งข้อความ ใช้ text-align

ตัวอย่าง

<h1 style="text-align:center;">หัวเรื่อง อยู่ตรงกลาง</h1>
<p style="text-align:left;">ย่อหน้า อยู่ด้านซ้าย</p>

การใช้งานสไตล์ต่างๆ แบบด้านบนนี้ไม่แนะนำให้ใช้ครับ เพราะจะลำบากเวลาแก้ไข แต่ให้รู้ว่าใช้งานยังไงก่อน ซึ่งจะสามารถเรียนการเพิ่มสไตล์ต่างๆ ได้ในภาษา CSS ครับ

ใส่ความเห็น

อีเมลของคุณจะไม่แสดงให้คนอื่นเห็น

Top