[CSS Tutorial สำหรับมือใหม่] เทคนิค CSS ที่ฉันน่าจะรู้ให้เร็วกว่านี้! [English]

designil

สอน CSS สำหรับมือใหม่

เมื่อไม่กี่วันที่ผ่านมามีคนใน Twitter ทวีตบทความหนึ่งเกี่ยวกับเทคนิค CSS ขั้นพื้นฐานขึ้นมาครับ ซึ่งหลังจากผมได้เข้าไปอ่านคร่าว ๆ ก็เห็นด้วยกับชื่อบทความนั้นทันทีเลยครับ “CSS Techniques I Wish I Knew When I Started Designing Websites” หรือแปลเป็นไทยไ้ด้ว่าเทคนิค CSS ที่ฉันน่าจะรู้ให้เร็วกว่านี้ตอนที่เริ่มดีไซน์เว็บไซต์”

บทความนี้ก่อนอ่านก็ควรจะรู้จักหน้าตา syntax ใน CSS เบื้องต้นก่อนครับ เช่นว่า # นำหน้าหมายถึง ID หรือ . นำหน้าหมายถึง class เป็นต้น หรือพูดได้ว่ารู้เรื่อง CSS นิดเดียวก็พออ่านเข้าใจแล้ว หัวข้อต่าง ๆ ที่มีในบทความนี้มีดังนี้ครับ:

  • รีเซ็ต CSS เพื่อแก้ไขปัญหาบราวเซอร์แต่ละอันแสดงผลต่างกัน
  • Box Model การสร้างกล่องด้วย CSS และความแตกต่างของ Margin-Padding
  • วิธีใช้ Min-height/width, Max-height/width และปัญหาที่เกิดขึ้นใน IE6
  • คุณสมบัติของ Float กับ Clear
  • การใส่เงื่อนไขใน Stylesheet
  • การใช้ Overflow กับ Zoom
  • ทำอย่างไรถ้า CSS ไม่ใช่คำตอบสำหรับปัญหานั้น ๆ

หลาย ๆ หัวข้ออาจไม่คุ้นหูนะครับ ขนาดผมใช้ CSS มาสักพักแล้วยังไม่รู้จัก Zoom เลยครับ เพราะฉะนั้นอยากแนะนำให้คนที่ใช้ CSS ตั้งแต่ระดับเบื้องต้นถึงระดับกลาง ๆ ลองอ่านดูครับ รับรองว่าจะได้ความรู้เรื่องการออกแบบเว็บไซต์มากขึ้นแน่นอนครับ

ข้อดีของบทความนี้ คือ จะมีลิงค์บทความอื่นที่เกี่ยวข้องกับหัวข้อนั้น ๆ ให้ไปอ่านหาข้อมูลกันต่อด้วย ถ้าเราอ่านอันไหนแล้วรู้สึกว่ายังไม่เข้าใจ ก็ตามลิงค์อื่น ๆ ที่เค้าให้มาไปอ่านดูครับ อย่างตอนผมอ่านก็งงเรื่อง Float กับ Clear เลยตามไปอ่าน ตอนนี้เข้าใจแล้วล่ะครับ แล้วที่สำคัญลิงค์พวกนี้จะพาเราไปหาเว็บไซต์ที่เกี่ยวกับเว็บดีไซน์อื่น ๆ ด้วยครับ

ไว้คราวหน้าจะลองแปลบทความนี้เป็นภาษาไทยมาให้อ่านกันครับ อ่านแบบภาษาอังกฤษแล้วสงสัยตรงไหนก็ถามได้เลยครับ

คลิกลิงค์ด้านล่างเพื่อไปอ่านบทความ:

>> CSS Tutorial: CSS Techniques I Wish I Knew When I Started Designing Websites <<




designil

designil

Front-end & WordPress Developer ที่ชอบอ่านบทความใหม่ ๆ ตลอดเวลา ชอบ Interactive เป็นชีวิตจิตใจ มีความฝันอยากทำ HTML5 Game ดี ๆ ออกมาสักเกม เขียน HTML / CSS / JS เป็นงานหลัก PHP เป็นงานเสริม
บทความทั้งหมด

5 Responses

  1. ถ้าชอบพวก Tutorial จะพยายามหามาให้อีกนะครับ ^^

Leave a Reply

Your email address will not be published. Required fields are marked *

Related posts