สำหรับค่า Property ของการเขียน CSS นั้นมากมายหลากหลาย ซึ่งผู้ที่สนใจสามารถหาอ่านได้ทั่วไป แต่ส่วนตัวที่ใช้งานบ่อยๆ จะประกอบด้วย
- font-size = ขนาดตัวอักษร
- color = สีตัวอักษร
- background = พื้นหลัง
- float = การไหลต่อกัน
- overflow = การครอบทั้งหมด
- width = ความกว้าง
- height = ความสูง
- margin = ระยะห่างจากขอบไปทางด้านนอก
- padding = ระยะห่างจากขอบถึงเนื้อหาด้านใน
ตัวอย่างการใช้งาน Property "float"
โค้ด HTML + CSS : ไหลตามกันไปทางซ้ายทั้งหมด
<div id="left-only">
<div class="left-one">
<p>← box one</p>
</div>
<div class="left-two">
<p>← box two</p>
</div>
<div class="left-three">
<p>← box three</p>
</div>
</div>
#left-only .left-one,
#left-only .left-two,
#left-only .left-three {
float: left;
padding: 2em;
}
การแสดงผล
← box one
← box two
← box three
โค้ด HTML + CSS : ไหลไปทางซ้าย และ ไหลไปทางขวา อย่างละอัน
<div id="overall-box">
<div class="left-one">
<p>← left box</p>
</div>
<div class="right-one">
<p>right box →</p>
</div>
</div>
#overall-box .left-one {
float: left;
padding: 2em;
}
#overall-box .right-one {
float: right;
padding: 2em;
}
การแสดงผล
← left box
right box →
