จัดรูปแบบข้อความ
ข้อความนี้เป็นแบบสไตล์กับบางส่วนของคุณสมบัติที่จัดรูปแบบข้อความ หัวข้อใช้ text-align, text-transform และ color คุณสมบัติ วรรคจะเยื้องชิดและช่องว่างระหว่างตัวอักษรที่ระบุไว้ ขีดเส้นใต้ถูกลบออกจากสีนี้ "ลองมันเอง" การเชื่อมโยง
สีข้อความ
color ทรัพย์สินที่ใช้ในการตั้งค่าสีของข้อความ
ด้วย CSS, สีส่วนใหญ่มักจะมีการระบุโดย:
- ชื่อสีที่ชอบ - "red"
- ค่า HEX - เหมือน "#ff0000"
- ค่า RGB - เหมือน "rgb(255,0,0)"
ดู CSS ค่าสี สำหรับรายการที่สมบูรณ์ของค่าสีที่เป็นไปได้
สีข้อความเริ่มต้นสำหรับหน้าถูกกำหนดไว้ในตัวเลือกของร่างกาย
 | หมายเหตุ: สำหรับ W3C CSS สอดคล้อง: ถ้าคุณกำหนด color คุณสมบัติคุณยังต้องกำหนด background-color ของสถานที่ |
|---|
การจัดตำแหน่งข้อความ
text-align ทรัพย์สินที่ใช้ในการตั้งค่าการจัดตำแหน่งแนวนอนของข้อความ
ข้อความสามารถด้านซ้ายหรือขวาชิดศูนย์กลางหรือธรรม
ตัวอย่างต่อไปนี้แสดงให้เห็นว่าศูนย์ชิดและทางซ้ายและขวาข้อความชิด (การจัดตำแหน่งที่เหลือเป็นค่าเริ่มต้นถ้าทิศทางข้อความจากซ้ายไปขวาและการจัดตำแหน่งที่เหมาะสมเป็นค่าเริ่มต้นถ้าทิศทางข้อความจากขวาไปซ้าย):
เมื่อ text-align ตั้งค่าคุณสมบัติเป็น "justify" แต่ละเส้นยืดสายเพื่อให้ทุกคนมีความกว้างเท่ากันและด้านซ้ายและขวาขอบตรง (เหมือนในนิตยสารและหนังสือพิมพ์):
ตกแต่งข้อความ
text-decoration ทรัพย์สินที่ใช้ในการตั้งค่าหรือยกเลิกการตกแต่งจากข้อความ
ค่า text-decoration: none; มักจะถูกใช้ในการลบขีดเส้นใต้จากการเชื่อมโยง:
อื่น ๆ text-decoration ค่าที่ใช้ในการตกแต่งข้อความ:
ตัวอย่าง
h1 {
text-decoration: overline;
}
h2 {
text-decoration: line-through;
}
h3 {
text-decoration: underline;
} ลองตัวเอง» | หมายเหตุ: ไม่แนะนำให้ขีดเส้นใต้ข้อความที่ไม่เชื่อมโยงเช่นนี้มักจะสับสนผู้อ่าน |
|---|
การแปลงข้อความ
text-transform คุณสมบัติถูกใช้เพื่อระบุตัวอักษรพิมพ์ใหญ่และตัวพิมพ์เล็กในข้อความ
มันสามารถนำมาใช้ในการเปิดทุกอย่างลงในตัวพิมพ์ใหญ่หรือตัวพิมพ์เล็กหรือใช้ตัวอักษรตัวแรกของแต่ละคำ:
ตัวอย่าง
p.uppercase {
text-transform: uppercase;
}
p.lowercase {
text-transform: lowercase;
}
p.capitalize {
text-transform: capitalize;
} ลองตัวเอง» เยื้องข้อความ
text-indent คุณสมบัติถูกใช้เพื่อระบุการเยื้องของบรรทัดแรกของข้อความ:
การเว้นวรรคตัวอักษร
letter-spacing คุณสมบัติถูกใช้เพื่อระบุช่องว่างระหว่างตัวละครในข้อความ
ตัวอย่างต่อไปนี้แสดงให้เห็นถึงวิธีการที่จะเพิ่มหรือลดช่องว่างระหว่างตัวอักษร:
เส้นความสูง
line-height คุณสมบัติถูกใช้เพื่อระบุช่องว่างระหว่างบรรทัด:
ทิศทางของข้อความ
direction ของสถานที่ใช้ในการเปลี่ยนทิศทางของข้อความขององค์ประกอบ:
ระยะห่าง Word
word-spacing คุณสมบัติถูกใช้เพื่อระบุช่องว่างระหว่างคำในข้อความ
ตัวอย่างต่อไปนี้แสดงให้เห็นถึงวิธีการที่จะเพิ่มหรือลดช่องว่างระหว่างคำว่า:
ตัวอย่างเพิ่มเติม
ปิดการใช้งานการตัดข้อความให้อยู่ในองค์ประกอบ
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการที่จะปิดการใช้งานการตัดข้อความให้อยู่ในองค์ประกอบ
แนวตั้งของภาพ
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการตั้งค่าจัดแนวตั้งของภาพในข้อความ
เพิ่มเงาให้กับข้อความ
ตัวอย่างนี้แสดงให้เห็นถึงวิธีการเพิ่มเงาให้กับข้อความ
ทดสอบด้วยตัวเองด้วยการออกกำลังกาย!
การใช้สิทธิ 1 » ออกกำลังกาย 2 » ออกกำลังกาย 3 » 4 การออกกำลังกาย» ออกกำลังกาย 5 »
คุณสมบัติทั้งหมด CSS ข้อความ
| คุณสมบัติ | ลักษณะ |
|---|---|
| color | ตั้งค่าสีของข้อความ |
| direction | ระบุทิศทางข้อความ / เขียนทิศทาง |
| letter-spacing | เพิ่มหรือลดช่องว่างระหว่างตัวอักษรในข้อความ |
| line-height | ตั้งค่าความสูงของสาย |
| text-align | ระบุการจัดตำแหน่งแนวนอนของข้อความ |
| text-decoration | ระบุการตกแต่งที่เพิ่มให้กับข้อความ |
| text-indent | ระบุเยื้องบรรทัดแรกในข้อความบล็อก |
| text-shadow | ระบุผลเงาที่เพิ่มให้กับข้อความ |
| text-transform | การควบคุมโครงสร้างเงินทุนของข้อความ |
| unicode-bidi | ใช้ร่วมกับ ทิศทาง คุณสมบัติการตั้งค่าหรือกลับมาไม่ว่าจะเป็นข้อความควรจะถูกแทนที่ให้การสนับสนุนหลายภาษาในเอกสารเดียวกัน |
| vertical-align | ชุดแนวตั้งขององค์ประกอบ |
| white-space | ระบุว่าพื้นที่สีขาวภายในองค์ประกอบจะถูกจัดการ |
| word-spacing | เพิ่มหรือลดช่องว่างระหว่างคำในข้อความ |