ยินดีต้อนรับคุณ, บุคคลทั่วไป กรุณา เข้าสู่ระบบ หรือ ลงทะเบียน

เข้าสู่ระบบด้วยชื่อผู้ใช้ รหัสผ่าน และระยะเวลาในเซสชั่น

ThaiSEOBoard.comพัฒนาเว็บไซต์Programmingช่วยอธิบายโค๊ด html อันนี้ให้หน่อยครับ คิดว่าสำหรับหลายๆคนน่าจะเป็นเรื่องง่ายๆ
หน้า: [1]   ลงล่าง
พิมพ์
ผู้เขียน หัวข้อ: ช่วยอธิบายโค๊ด html อันนี้ให้หน่อยครับ คิดว่าสำหรับหลายๆคนน่าจะเป็นเรื่องง่ายๆ  (อ่าน 1955 ครั้ง)
0 สมาชิก และ 1 บุคคลทั่วไป กำลังดูหัวข้อนี้
zern
เจ้าพ่อบอร์ดเสียว
*

พลังน้ำใจ: 117
ออฟไลน์ ออฟไลน์

กระทู้: 3,244



ดูรายละเอียด
« เมื่อ: 27 เมษายน 2010, 17:04:32 »

<p style="border: solid 6px #6B8E23; background: #F0FFF0; padding: 15px; -moz-border-radius: 15px; -khtml-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; margin: 0; text-align: justify; line-height: 23px; color: #006400; font-size: 16px">

p อันนี้เป็นการจัดย่อหน้า
style="border: solid 6px #6B8E23 = บอกว่าให้ล้อมกรอบด้วยเส้นตัวหนาสี #6B8E23
background: #F0FFF0 = พื้นหลังของกรอบสี #F0FFF0
padding: 15px = Huh?
-moz-border-radius: 15px = Huh?
-khtml-border-radius: 15px = Huh?
-webkit-border-radius: 15px = Huh?
border-radius: 15px = Huh?
 margin: 0 = Huh?
text-align: justify; line-height: 23px = Huh?

color: #006400; font-size: 16px สีตัวอักษร #006400 ขนาด 16px

ตรงตัวหนาคือตรงที่ไม่เข้าใจน่ะครับ มันหมายความว่ายังไงบ้าง
บันทึกการเข้า

สูงสุด ที่สุดก็คืนสู่สามัญ
Condothai
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 56
ออฟไลน์ ออฟไลน์

กระทู้: 1,024



ดูรายละเอียด เว็บไซต์
« ตอบ #1 เมื่อ: 27 เมษายน 2010, 17:16:21 »

padding กับ margin จะคล้ายๆกันครับ padding วัดจากขอบ object เข้าด้านใน ส่วน margin วัดจากขอบ object ออกด้านนอก

ส่วนพวก border-radius คือความโค้งของ border ครับ เหมือนมุมมนตรงขอบสี่เหลี่ยม ที่เห็นมันมีหลายบรรทัด เพราะทำไว้สำหรับหลายๆ browser ครับ

text-align:justify คือการจัดตัวอักษรให้ชิดซ้ายขวา มันดูสวยจริง แต่ตัวอักษรตรงกลางจะยืดๆ

line-height: 23px คือความสูงของบรรทัดครับ (ไม่ใช่ความสูงของตัวอักษร) เช่น H1 อาจจะสูง 18px แต่ถ้าเราบอกให้บรรทัดมันขนาด 23px มันจะดันบนล่างให้เท่าๆกับ 23px

อธิบายไม่ค่อยเก่ง แต่ก็ประมาณนี้ละครับ  Tongue
บันทึกการเข้า

deadclosed
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 133
ออฟไลน์ ออฟไลน์

กระทู้: 1,553



ดูรายละเอียด เว็บไซต์
« ตอบ #2 เมื่อ: 27 เมษายน 2010, 17:23:17 »

padding: 15px = Huh?
-moz-border-radius: 15px = Huh?
-khtml-border-radius: 15px = Huh?
-webkit-border-radius: 15px = Huh?
border-radius: 15px = Huh?
 margin: 0 = Huh?
text-align: justify; line-height: 23px = Huh?

padding ระยะห่างภายในของวัตถุ
-moz-border-radius:คำสั่งcss ทำให้ วัตถุมีมุมโค้งภายใน FF
-khtml-border-radius จากข้อความที่2 แต่ใช้ของเคเมส
-webkit-border-radius จากข้อความที่2 แต่ใช้ของเว็บkit
margin : ระยะห่างระหว่างวัตถุ
text-align: justify; line-height คำสั่งจัดการตัวอักษร

อธิบายไม่เข้าใจก็ขอโทษด้วย
และที่
-moz
-khtml
-webkit
อธิบาย ง่ายๆคือการ แอ็ก cssของบราวเซอร์นั้นๆ Tongue
« แก้ไขครั้งสุดท้าย: 27 เมษายน 2010, 17:25:29 โดย deadclosed » บันทึกการเข้า
zern
เจ้าพ่อบอร์ดเสียว
*

พลังน้ำใจ: 117
ออฟไลน์ ออฟไลน์

กระทู้: 3,244



ดูรายละเอียด
« ตอบ #3 เมื่อ: 27 เมษายน 2010, 17:29:12 »

เอ แล้ว border-radius ผมใส่ไปเฉยๆโดยไม่ระบุ browser ได้หรือเปล่าครับ
+ ใ้ห้แล้วนะครับ  wanwan017
บันทึกการเข้า

สูงสุด ที่สุดก็คืนสู่สามัญ
etlovesgod
คนรักเสียว
*

พลังน้ำใจ: 3
ออฟไลน์ ออฟไลน์

กระทู้: 126



ดูรายละเอียด เว็บไซต์
« ตอบ #4 เมื่อ: 27 เมษายน 2010, 17:32:04 »

มานั่งรอเก็บความรู้ครับ wanwan008
บันทึกการเข้า

deadclosed
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 133
ออฟไลน์ ออฟไลน์

กระทู้: 1,553



ดูรายละเอียด เว็บไซต์
« ตอบ #5 เมื่อ: 27 เมษายน 2010, 17:37:59 »

เอ แล้ว border-radius ผมใส่ไปเฉยๆโดยไม่ระบุ browser ได้หรือเปล่าครับ
+ ใ้ห้แล้วนะครับ  wanwan017

สำหรับ บราวเซอร์ที่สนับสนุน CSS3
ก็ใช้คำสั่งนี้เลย
เช่น opera 9.50 และอื่น ๆ

ประมาณนี้ครับ wanwan017
บันทึกการเข้า
หน้า: [1]   ขึ้นบน
พิมพ์