ให้เรตสมาชิก: 5 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวใช้งานดาวใช้งาน
 
Boxsize
Boxsize

 

CSS Box Sizing คืออะไร

 

    CSS ย่อมาจาก Cascading Style Sheet หรือ Style sheet ที่ใช้กำหนดรูปแแบหน้าตาของไฟล์ Htmlมีสมบัติ Cascading คือ คำสั่งที่อยู่บนสุดจะทำก่อนเสมอ สามารถใช้กำหนดรูปแบบ Font สี และอื่นๆที่แสดงบนหน้าเว็บไชต์ทั้งหมด สามารถเขียน CSS ไว้ในไฟล์ HTML เลยหรือแยกเป็นไฟล์ style sheet ต่างหากแล้วเรียกใช้ภายหลังก็ได้

     CSS Box Sizing  คือ การกำหนดขนาดของกล่อง Element ที่ครอบ Element นั้นอยู่ 

 

หากไม่มีคุณสมบัติของ CSS box-sizing

     width + padding + border คือ ความกว้างที่แท้จริงของ Element 
     height + padding + border คือ ความสูงที่แท้จริงของ Element 

อธิบาย Boxsizeอธิบาย Boxsize

 

ตัวอย่าง 

<!DOCTYPE html>
<html>
<head>
<style> 

.div1 {
    width: 300px;
    height: 70px;    
    padding: 60px;
    border: 1px solid red;
}
</style>
</head>
<body>

<br>
<div class="div1">(width is also 300px and height is 70px).</div>

</body>
</html>

 

ผลลัพธ์

ผลลัพธ์
ผลลัพธ์

 

Reference : https://www.w3schools.com/css

 

ช่องทางการศึกษาเพิ่มเติมข่าวที่น่าสนใจเกี่ยวกับ : HTML css bootstrap

 

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
การจัดทำใบสั่งขาย ในโปรแกรม Open ERP
โดย Chidchanok ศ 18 ม.ค. 2019 11:55 am บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
1
ศ 18 ม.ค. 2019 11:55 am โดย Chidchanok
ชีวิตการทำงาน
โดย จันนุสรณ์ ดีแก่ ศ 18 ม.ค. 2019 11:25 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
6
ศ 18 ม.ค. 2019 11:25 am โดย จันนุสรณ์ ดีแก่
ขั้นตอนการสร้างเว็บบอร์ดย่อยภายใต้หมวดหมู่ สำหรับแอดมิน หรือผู้ดูแลระบบ
โดย จันนุสรณ์ ดีแก่ ศ 18 ม.ค. 2019 11:03 am บอร์ด phpBB user Guide Knowledge
0
3
ศ 18 ม.ค. 2019 11:03 am โดย จันนุสรณ์ ดีแก่
[Extension phpBB3.1.1] FlatUI Smilies Extention ไอคอนแสดงอารมณ์เพิ่มสีสันแก่เว็บบอร์ด
โดย จันนุสรณ์ ดีแก่ ศ 18 ม.ค. 2019 10:23 am บอร์ด phpBB 3.1 Extension Review
0
1
ศ 18 ม.ค. 2019 10:23 am โดย จันนุสรณ์ ดีแก่
[Extension phpBB3.1.1] SE Square Extension ไตล์โทนสีน้ำเงินอ่อนและฟ้าอ่อน
โดย จันนุสรณ์ ดีแก่ ศ 18 ม.ค. 2019 9:42 am บอร์ด phpBB 3.1 Extension Review
0
2
ศ 18 ม.ค. 2019 9:42 am โดย จันนุสรณ์ ดีแก่
สอบถามวิธีการเปิดสิทธ์ใช้งานใน google docs ค่ะ
โดย ณัฐกฤตา บุญญะฤทธิ์ ศ 18 ม.ค. 2019 9:34 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
2
13
ศ 18 ม.ค. 2019 10:17 am โดย ณัฐกฤตา บุญญะฤทธิ์
การใช้งาน bootstrap Tooltip
โดย abdkode พฤ 17 ม.ค. 2019 7:10 pm บอร์ด Jquery & Ajax Knowledge
0
12
พฤ 17 ม.ค. 2019 7:10 pm โดย abdkode
ว่าด้วยภาษีรถยนต์
โดย abdkode พฤ 17 ม.ค. 2019 6:46 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
10
พฤ 17 ม.ค. 2019 6:46 pm โดย abdkode
การทำใบเสนอราคา (Quotations) ในโปรแกรม Open ERP
โดย Chidchanok พฤ 17 ม.ค. 2019 6:37 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
12
พฤ 17 ม.ค. 2019 6:37 pm โดย Chidchanok
ความแตกต่างของ get และ post
โดย abdkode พฤ 17 ม.ค. 2019 6:19 pm บอร์ด PHP Knowledge
0
19
พฤ 17 ม.ค. 2019 6:19 pm โดย abdkode
การเพิ่มข้ออมูลลูกค้า ในโปรแกรม Open ERP
โดย Chidchanok พฤ 17 ม.ค. 2019 5:31 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
8
พฤ 17 ม.ค. 2019 5:31 pm โดย Chidchanok
เงื่อนไขในการขนส่งสินค้า
โดย Chidchanok พฤ 17 ม.ค. 2019 4:41 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
11
พฤ 17 ม.ค. 2019 4:41 pm โดย Chidchanok
ภาษีโรงเรือนและที่ดิน ต้องเสียภาษีอย่างไร
โดย Chidchanok พฤ 17 ม.ค. 2019 3:59 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
13
พฤ 17 ม.ค. 2019 3:59 pm โดย Chidchanok
โปรแกรมตัดแต่งรูป ที่ใช้กับ Ubuntu มีโปรแกรมอะไรบ้างค่ะ
โดย ณัฐกฤตา บุญญะฤทธิ์ พฤ 17 ม.ค. 2019 3:34 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
4
22
ศ 18 ม.ค. 2019 10:47 am โดย ณัฐกฤตา บุญญะฤทธิ์
ภาษีป้าย ต้องเสียภาษีอย่างไร
โดย Chidchanok พฤ 17 ม.ค. 2019 3:30 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
7
พฤ 17 ม.ค. 2019 3:30 pm โดย Chidchanok
วิดิโอใน google drive ขึ้น This video format is not supported. แก้ไขยังๆไงคะ
โดย Chidchanok พฤ 17 ม.ค. 2019 2:26 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
1
20
พฤ 17 ม.ค. 2019 6:10 pm โดย thatsawan
วิธีการลบ แถบหมวดเมนู .MOD(Extension) ใน phpbb
โดย Ittichai_chupol พฤ 17 ม.ค. 2019 1:59 pm บอร์ด PHP Knowledge
0
7
พฤ 17 ม.ค. 2019 1:59 pm โดย Ittichai_chupol
การขีดเส้นใต้ตัวอักษร ในเว็บบอร์ด phpBB โดยใช้เครื่องมือใน BBcode
โดย จันนุสรณ์ ดีแก่ พฤ 17 ม.ค. 2019 1:11 pm บอร์ด phpBB user Guide Knowledge
0
33
พฤ 17 ม.ค. 2019 1:11 pm โดย จันนุสรณ์ ดีแก่
หนี้สูญได้รับคืน ต้องบันทึกบัญชีอย่างไร
โดย Chidchanok พฤ 17 ม.ค. 2019 12:33 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
34
พฤ 17 ม.ค. 2019 12:33 pm โดย Chidchanok
มาทำความรู้จักกับหนี้สูญและหนี้สงสัยจะสูญ
โดย Chidchanok พฤ 17 ม.ค. 2019 11:43 am บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
38
พฤ 17 ม.ค. 2019 11:43 am โดย Chidchanok