F0NTCAMP02 | เบซิกเบสิก CSS

[หนูอร]

กำลังจะพิมพ์เลย แต้งกิ้วค่ากวาง 

[iannnnn]

เสริมเรื่องการตั้งค่า "ทุกอย่าง" ที่กวางบอก
ลองค้นกูเกิ้ลด้วยคำว่า CSS Reset จะพบว่าฝรั่งเขามีเขียนไว้หลายหลักสูตรมากๆ
ซึ่งประโยชน์ของมันก็คือมันจะล้างค่า Default (ที่ไม่ค่อยเท่ากัน) ของแต่ะลเบราว์เซอร์ทิ้ง
เช่นพวก ul / li / p / div / margin ของสารพัดวัตถุ

แล้วหลังจากนั้นเรามากำหนดใหม่เอาเอง จะได้สวยสมใจ

[ออยอิชี่]

เหมือนได้อ่านทบทวนที่เรียนไปก่อนสอบอีกครั้งเลย 

หนูอรกับกวางพิมพ์ละเอียดมากเลย 

[eThics]

2 คนนี้นี่ดีนะ ช่วยกันเสริม

รวมเล่มเป็น acrobat file ก็ดีนะ  

[หนูอร]

ความแตกต่างระหว่าง class และ id

ถ้าแปลตรงตัว.. class นั้นคือชนชั้น และ id คือการระบุตัวตน (identity)

การระบุ class จะสามารถนำไปใช้ได้หลายๆครั้ง ในขณะที่ id นั้น เหมือนการแยกเอาออกมาเป็นตัวย่อย ซึ่งจะมีลักษณะแบบนี้แค่หนึ่งเดียว จะมาซ้ำอีกไม่ได้ สมมุติว่า class หนึ่งแสดงความเป็น "สมาชิกฟ๐นต์" หลายคนนั้นจะสามารถเป็นสมาชิกฟอนต์ได้ แต่ถ้ากำหนด id ความเป็น "ยักษ์แอนนนนน" ก็จะมีได้เพียงคนเดียว

[หนูอร]

2 คนนี้นี่ดีนะ ช่วยกันเสริม

รวมเล่มเป็น acrobat file ก็ดีนะ  

มีพิมพ์รวมเล่มลง word แล้วค่ะ รอลงในนี้แล้วมาเกลามาแก้อีกรอบก่อน

แล้วค่อยรวมไว้ขายแจกอีกที  



ไปกินข้าวกินยาก่อนนะคะ ฟื้นแล้วจะมาต่อค่ะ

[JΛNΣ]

เสริมเรื่องการตั้งค่า "ทุกอย่าง" ที่กวางบอก
ลองค้นกูเกิ้ลด้วยคำว่า CSS Reset จะพบว่าฝรั่งเขามีเขียนไว้หลายหลักสูตรมากๆ
ซึ่งประโยชน์ของมันก็คือมันจะล้างค่า Default (ที่ไม่ค่อยเท่ากัน) ของแต่ะลเบราว์เซอร์ทิ้ง
เช่นพวก ul / li / p / div / margin ของสารพัดวัตถุ

แล้วหลังจากนั้นเรามากำหนดใหม่เอาเอง จะได้สวยสมใจ

ถามเรื่องการ reset หรือล้างค่า default หน่อยครับ
คือไหนๆ เราก็จะมากำหนดใหม่เอาเองทีหลังแล้ว ทำไมต้องไป reset มันก่อนด้วยครับ 

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

[iannnnn]

ไม่ว่าใครๆ ที่หัด CSS ก็จะต้องงงเรื่องความแตกต่างระหว่าง Class กับ ID แหละครับ
ตูกว่าจะรู้เรื่องกะเขาก็กินเวลายาวนานมาก ใช้สลับกันมั่วตั้งหลายปีดีดักดาน


ลองอ่านเพิ่มเติมได้จากแถวนี้
http://insidewebmaster.com/2009/02/css-class-id-difference/
http://www.tizag.com/cssT/cssid.php
^ ตูลืมอธิบายเรื่องที่เว็บนี้บอก คือตัว ID เนี่ยเอาไว้ระบุ "ชื่อเรียก" ของวัตถุในกรณีที่จะใช้งานในเชิงโปรแกรมมิ่งด้วย

http://webdesign.about.com/cs/css/qt/tipcssclassvsid.htm
http://www.maxi-pedia.com/css+id+class

[iannnnn]

ถามเรื่องการ reset หรือล้างค่า default หน่อยครับ
คือไหนๆ เราก็จะมากำหนดใหม่เอาเองทีหลังแล้ว ทำไมต้องไป reset มันก่อนด้วยครับ 

เพราะเบราวเซอร์แต่ละเจ้านั้นมีค่า Default ในการแสดงผลไม่เหมือนกันในบางแท็กครับ
บางครั้งเราจะเจอปัญหาเวลาเขียน CSS ว่าเฮ้ย ทำไมพอเขียน <p> แล้วเปิดดูในหมาย่างกะไออีไม่เหมือนกันวะ
หรือเวลาเขียน li / ul แล้วกำหนดสีให้มัน ไหงในแต่ละเบราว์เซอร์ (จริงๆ ก็คือไออีเทียบกะยี่ห้ออื่น)
ถึงได้แตกต่างกันขนาดนี้

http://phonophunk.com/articles/ie-fix-for-gaps-between-list-items.php
http://www.killersites.com/forums/topic/1357/css-ul-li-menu-issue-in-internet-explorer-60-ie6/
^ โอ๊ะ อันนี้ก็ล้ำมาก ไม่ได้สอนอีกแล้ว คือการล้างค่าความห่วยของ IE6 ให้ห่วยเท่า IE7 ก็พอ

การที่เราล้างทุกอย่าง(ที่ควร)ให้เป็น 0 ก่อนแล้วค่อยว่ากันนั้น
เลยทำให้การกำหนดค่าต่างๆ ตามที่ต้องการได้ง่ายขึ้นครับ

[กวางจ้ะ]

อารมณ์เดียวกับขี้เกียจแก้มันทุก class และทุก id
ก็เลยใช้ * ล้างซะเลย 

[JΛNΣ]

อ้อ ขอบคุณครับ


ตั้งแต่เคยเขียนมา ไม่เคยล้างมันเลย 

[กวางจ้ะ]

ไม่ว่าใครๆ ที่หัด CSS ก็จะต้องงงเรื่องความแตกต่างระหว่าง Class กับ ID แหละครับ
ตูกว่าจะรู้เรื่องกะเขาก็กินเวลายาวนานมาก ใช้สลับกันมั่วตั้งหลายปีดีดักดาน


ลองอ่านเพิ่มเติมได้จากแถวนี้
http://insidewebmaster.com/2009/02/css-class-id-difference/
http://www.tizag.com/cssT/cssid.php
^ ตูลืมอธิบายเรื่องที่เว็บนี้บอก คือตัว ID เนี่ยเอาไว้ระบุ "ชื่อเรียก" ของวัตถุในกรณีที่จะใช้งานในเชิงโปรแกรมมิ่งด้วย

http://webdesign.about.com/cs/css/qt/tipcssclassvsid.htm
http://www.maxi-pedia.com/css+id+class

ดุกแก้ความสับสนด้วยการใช้ name แทนการใช้ id ในการระบุตัวแปรในแท็ก input ต่าง ๆ จ้ะ (ใช้แทนกันได้เหมือนกัน) เช่น

<input type=text name=textname1>

ก็จะได้ช่องใส่ข้อความที่ชื่อ textname1
เพราะ id มันใช้ซ้ำซ้อนเหลือเกินล่ะ กลัวงงเด้อค่ะเด้อ

แต่ถ้าในกรณีที่ใช้งานร่วมกับ javascript ก็จะมีการระบุ id ใน form เป็น case by case ไป อาจใส่ comment กันงงอีกทีจ้ะ

[เดอะบุ๋ม]

แจ่มแหล่ม  

2 คนนี้นี่ดีนะ ช่วยกันเสริม

รวมเล่มเป็น acrobat file ก็ดีนะ 

มีพิมพ์รวมเล่มลง word แล้วค่ะ รอลงในนี้แล้วมาเกลามาแก้อีกรอบก่อน

แล้วค่อยรวมไว้ขายแจกอีกที   

[Layiji]

โอ้ว มีการรีเซ็ตค่าด้วย 

[JΛNΣ]

ใช่ๆ ใช้ table ไม่เห็นต้องรีซ้งรีเซ็ตอะไรเลย