Sitthiphorn Anthawonksa

การทำ Modal window แบบประหยัด Code

บางทีเราไม่จำเป็นต้องเขียนโค้ด HTML ให้มันยาวเพื่อความสะดวกของการเขียน CSS วันนี้ผมขอมาไวเครมเร็ว เสนอบทความก้อมอันเนื่องมาจาก หงุดหงิดทุกครั้งเมื่อเห็นคนอื่นเขียน HTML Code ยาวเฟื้อยทั้งๆ ที่มันสามารถเขียนให้สั้นๆ กระชับ ดับโลกร้อนได้ ThaiCSS Direct วันนี้ขอเสนอ “การทำ Modal หรือ Pop up แบบกากๆ” หรือการเรียกใช้ :before และ :after (pseudo-element) ให้เกิดประโยชน์

Front-End Engineer เร็วส์ แรง แม่นยำ

ไม่ใช่เฉพาะคนที่จะมาเป็น Front-end Engineer เท่านั้นที่ต้องคำนึงถึงสิ่งนี้ ทุกๆ คนที่มีส่วนร่วมก็ต้องพึงระลึกไว้เสมอ เวลาที่เราต้องเริ่มเขียน CSS หรือ JavaScript สิ่งที่ต้องระมัดระวังในเรื่องนี้ก็คือ ขยะที่เกิดจากการไม่ได้วางแผนที่ดีก่อนที่จะลงมือเขียน ผมขอแนะนำก่อนที่จะลงมือเขียนเหี้ย ห่าอะไรลงไป ให้วางโครงสร้างการ import และการรวมไฟล์เอาไว้ก่อน

ชีวิต Front-End ไม่ได้ง่าย แต่ก็ไม่มีใครบอกว่ามันยาก

ยังจำกันได้ไหมสมัยเก่าที่เรายังนั่งใช้ image ready ตัด HTML และ CSS ออกมาจาก Adobe Photoshop แล้วก็ส่งต่อหน้าเว็บไปให้ Programer จัดการ ถัดมาไม่นานเราก็เริ่มมีมนุษย์จำพวกเขียน div เข้ามาแทน ดริ๊ฟท์กันกระจายกลายเป็นเมืองแห่ง div ถือได้ว่าเฟื่องฟูครับ เฟื่องฟูมากกับการรับตัดหน้าเว็บด้วย div ราคาหน้าละสามร้อยห้าสิบบาท เรียกได้ว่าวงการสั่นสะเทือนเลือนลั่น พร้อมๆ กับการย้อมแมวว่าเขียน div แล้ว SEO มากันเพียบแน่นอน Google เจอเราภายใน 800 มิลลิเซคคั่น

CSS Flexible Box Layout ตอนที่ 1

ผมไม่ได้เขียน CSS HTML มานานมากกกกกแล้ว มันอาจจะทำใจได้ยากสักนิดในช่วงแรกที่ต้องอดกลั้นไม่ทำในสิ่งที่ตัวเองถนัด เพราะเอาเวลาไปทำอย่างอื่นที่น่าสนุกว่า ท้าทายกว่าเหมือนกับที่เขาว่าไว้ เราต้องเดินไปข้างหน้า เป็นเหตุให้ ThaiCSS ไม่มีบทความใหม่ออกมาเลยตั้งแต่ต้นปีที่ผ่านมา Kulachat Kena เองยังโผล่มาแค่บทความเดียวแล้วหายจ้อย เปล่าเลย เขาไม่ได้ตั้งใจหายไปไหน อาจเป็นเพราะผมให้งานเขาทำหนักเกินไป จนไม่มีกระจิตกระใจลงมาวาดลวดลายใน ThaiCSS เป็นคำรบที่สอง แต่อีกไม่นานเขาคงกลับมาพร้อมประสบการณ์ที่มากกว่า สุขขุมลุ่มลึกกว่า รวมไปถึงเขาอาจจะมีสามหำไปแล้วก็เป็นได้

มันช่างยาวนาน และเรายังไม่ตาย

อย่ากระนั้นเลยพี่ข้า แม้เนื้อหา เรื่องราวจะคับใจ แน่นอกแต่เราก็ไม่มีเวลามายกออก อาจเป็นเพราะการงานที่บีบรัดจนไข่เขียวจึงทำให้เราไม่มีเวลา หรือการร่ำสุราทำให้เราต้องหายหน้าไปจากหน้าเว็บแห่งนี้

หนึ่งปีกับอีกสิบกว่าวันที่ ThaiCSS ไม่ได้อัพเดทแม้แต่บทความเดียว มันช่างน่าละอายใจยิ่งนักกับความสันหลังยาวของกระผมเอง ซึ่งบทความก่อนหน้าที่เขียนเอาไว้ก็ตั้งแต่วันที่ 9 เดือน 11 ปี 2012 โน่น

ลำดับความสำคัญของ Selectors ใน CSS

เรื่องราวสั้นๆ ว่าด้วยหลักการคำนวณและเรียงลำดับความสำคัญของ CSS Selectors เพื่อการแสดงผล ก่อน หลังในการสั่งงาน

CSS มีกฎการลำดับความสำคัญของการใช้ Selectors ควบคุมอยู่ ความสำคัญมาก สำคัญน้อย ขึ้นอยู่กับผลรวมคะแนนของ Selectors ในแต่ละชุด โดยใช้กฎการนับเลขเข้ามาช่วย มี 3 หลัก คือ หลักร้อย หลักสิบ หลักหน่วย

Back to Top