Latest web development tutorials
×

CSS หลักสูตร

CSS หลักสูตร CSS แนะนำโดยย่อ CSS ไวยากรณ์ CSS Id และ Class ผู้เลือก CSS สร้าง CSS พื้นหลัง(background) CSS ข้อความ(text) CSS แบบอักษร(Fonts) CSS ลิงค์(link) CSS ลักษณะของรายการ(ul) CSS ตาราง(table) CSS รูปแบบกล่อง CSS กรอบ(border) CSS เส้นแสดงรูปร่าง(outline) CSS ขอบ(margin) CSS การกรอก(padding) CSS การจัดกลุ่มและการสร้างรัง CSS ขนาด(Dimension) CSS แสดงผล(display) CSS ตั้งอยู่(position) CSS ลอย(float) CSS เป็นเส้นตรง(align) CSS การรวมกันของเตอร์ CSS หลอกชั้นเรียน CSS องค์ประกอบหลอก CSS ป้าย CSS เมนูแบบเลื่อนลง CSS แกลเลอรี่ภาพ CSS ภาพใส/ทึบแสง CSS ภาพโมเสคเทคโนโลยี CSS ประเภทสื่อ CSS แอตทริบิวต์เตอร์ CSS ย่อ CSS ตัวอย่าง

CSS3 หลักสูตร

CSS3 หลักสูตร CSS3 แนะนำโดยย่อ CSS3 กรอบ(border) CSS3 พื้นหลัง CSS3 การเปลี่ยนแปลงอย่างค่อยเป็นค่อยไป CSS3 ผลข้อความ CSS3 แบบอักษร CSS3 2D เปลี่ยนแปลง CSS3 3D เปลี่ยนแปลง CSS3 การเปลี่ยนแปลง CSS3 นิเมชั่น CSS3 หลายคอลัมน์ CSS3 ส่วนติดต่อผู้ใช้

CSS ออกแบบที่ตอบสนอง

Viewport ตารางมุมมอง คำสั่งสื่อ ภาพ วีดีโอ(video) กรอบ

CSS คู่มืออ้างอิง

CSS คู่มืออ้างอิง CSS ผู้เลือก CSS อ้างอิงคำพูด CSS Web แบบอักษรปลอดภัย CSS นิเมชั่น CSS หน่วย CSS สี CSS ค่าสี CSS ชื่อสี CSS สีเลขฐานสิบหก

CSS ข้อความ (text)

รูปแบบข้อความ

ข้อความนี้เป็นสไตล์ที่มีบางส่วนที่จัดรูปแบบข้อความคุณสมบัติ. ที่มุ่งหน้าไปใช้ที่ text-align = ซ้ายข้อความแปลงและคุณสมบัติของสี. ที่ย่อหน้าเยื้องชิดและในช่องว่างระหว่างตัวอักษรระบุไว้. ที่ขีดเส้นใต้ถูกลบออกจากที่ " ลอง " การเชื่อมโยง

สีข้อความ

แอตทริบิวต์สีที่ใช้ในการตั้งค่าสีของข้อความ

สีส่วนใหญ่มักจะระบุโดย CSS:

  • ค่าเลขฐานสิบหก - เช่น "# FF0000"
  • ค่า RGB - "rgb (255,0,0)"
  • ชื่อสี - เช่น "สีแดง"

ดู ค่าสี CSS ดูค่าสีที่สมบูรณ์

พื้นหลังของหน้านี้เป็นตัวหลักของการเลือกวิธีการ:

ตัวอย่าง

body {color:blue;}
h1 {color:#00ff00;}
h2 {color:rgb(255,0,0);}

ลอง»

คำพูด สำหรับมาตรฐานของ W3C CSS: หากคุณกำหนดคุณสมบัติสีที่คุณจะต้องยังปรับแต่งคุณลักษณะสีพื้นหลัง


การจัดตำแหน่งของข้อความ

คุณสมบัติ text-align จะใช้ในการตั้งค่าการจัดตำแหน่งแนวนอนของข้อความ

ข้อความที่สามารถเป็นศูนย์กลางหรือชิดไปทางซ้ายหรือขวาธรรม

เมื่อ text-align ตั้ง "ปรับ" แต่ละบรรทัดได้รับการขยายความกว้างเดียวกันซ้ายและขอบขวามีความสอดคล้อง (เช่นนิตยสารและหนังสือพิมพ์)

ตัวอย่าง

h1 {text-align:center;}
p.date {text-align:right;}
p.main {text-align:justify;}

ลอง»


ตกแต่งข้อความ

สถานที่ให้บริการตกแต่งข้อความที่ใช้ในการตั้งค่าหรือลบข้อความของตกแต่งบ้าน

จากจุดการออกแบบของมุมมองส่วนใหญ่เป็นสถานที่ให้บริการตกแต่งข้อความใช้ในการลบการขีดเส้นใต้การเชื่อมโยง:

ตัวอย่าง

a {text-decoration:none;}

ลอง»

นอกจากนี้คุณยังสามารถตกแต่งข้อความนี้:

ตัวอย่าง

h1 {text-decoration:overline;}
h2 {text-decoration:line-through;}
h3 {text-decoration:underline;}

ลอง»

คำพูด เราไม่แนะนำให้เน้นว่าข้อความนั้นไม่ได้มีการเชื่อมโยงเพราะมันมักจะสับสนกับผู้ใช้


แปลงข้อความ

แอตทริบิวต์ข้อความแปลงถูกใช้เพื่อระบุตัวอักษรพิมพ์ใหญ่และตัวพิมพ์เล็กในข้อความ

ชื่อย่อสามารถใช้สำหรับทุกอย่างลงในตัวพิมพ์ใหญ่หรือตัวพิมพ์เล็กหรือแต่ละคำนิยาม

ตัวอย่าง

p.uppercase {text-transform:uppercase;}
p.lowercase {text-transform:lowercase;}
p.capitalize {text-transform:capitalize;}

ลอง»


ข้อความเยื้อง

ข้อความเยื้องคุณสมบัติการเยื้องบรรทัดแรกถูกใช้เพื่อระบุข้อความ

ตัวอย่าง

p {text-indent:50px;}

ลอง»


ตัวอย่าง

ตัวอย่างเพิ่มเติม

พื้นที่ที่กำหนดระหว่างตัวละคร
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการที่จะเพิ่มหรือลดช่องว่างระหว่างตัวอักษร

ระบุช่องว่างระหว่างแถวและแถว
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการระบุช่องว่างระหว่างแถวในย่อหน้า

การตั้งค่าองค์ประกอบปฐมนิเทศข้อความ
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการที่จะเปลี่ยนทิศทางขององค์ประกอบข้อความ

เพิ่มพื้นที่ว่างระหว่างคำ
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการเพิ่มพื้นที่ว่างระหว่างคำในวรรค

ปิดการใช้งานการตัดข้อความในองค์ประกอบ
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการที่จะปิดการใช้งานข้อความองค์ประกอบภายในเซอร์ราวด์

ภาพแนวตั้ง
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการตั้งแนวตั้งของภาพข้อความ

เพิ่มเงาข้อความ
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการตั้งค่าเงาข้อความ


แอตทริบิวต์ของข้อความ CSS ทั้งหมด

คุณสมบัติ ลักษณะ
สี การตั้งค่าสีของตัวอักษร
ทิศทาง การตั้งค่าการวางแนวข้อความ
ตัวอักษรการเว้นวรรค การตั้งระยะห่างตัวอักขระ
line-height การตั้งค่าความสูงของแถว
text-align ตําแหน่งข้อความในองค์ประกอบ
ตกแต่งข้อความ การเพิ่มการปรับเปลี่ยนข้อความ
ข้อความเยื้อง เยื้องบรรทัดแรกขององค์ประกอบของจีน
ข้อความเงา ตั้งเงาข้อความ
ข้อความเปลี่ยน ตัวอักษรองค์ประกอบการควบคุม
Unicode-bidi ชุดหรือผลตอบแทนไม่ว่าจะเป็นข้อความที่ถูกเขียนใหม่
แนวตั้ง-align ตั้งแนวตั้งขององค์ประกอบ
พื้นที่สีขาว องค์ประกอบชุดที่ว่างเปล่าจะถูกจัดการ
คำเว้นวรรค การตั้งค่าการเว้นวรรคคำว่า