วิธีการใช้งาน css clamp()
เมื่อเราพูดถึงการทำเว็บแบบ Responsive การใช้งาน clamp() เป็นเครื่องมือที่น่าสนใจในการจัดการขนาดตามขนาดของอุปกรณ์ที่แสดงผล
CSS HTML
ทำความเข้าใจ CSS Flexbox - 1
ในปัจจุบัน ในการจัด layout ของเว็บไซต์ เราสามารถใช้ CSS Flexbox ซึ่งสะดวกสบายกว่าแต่ก่อนที่เราใช้ table, float หรือ position ได้มากขึ้นเยอะ
วิธีสร้าง accordion โดยไม่ต้องใช้ javascript
ในความคิดของหลาย ๆ คนคิดว่า ถ้าจะสร้าง accordion สำหรับใช้ในเว็บไซต์ เราต้องใช้ javascript ประกอบ แต่ที่จริงแล้ว ตัว html มี tag ที่สามารถใช้งานในลักษณะคล้ายกับ accordion ไว้ให้อยู่แล้ว tag นั้นก็คือ details
อะไรคือ Empty Element
สำหรับคำถามว่า อะไรคือ Empty Element เราสามารถบอกได้คร่าว ๆ คือ element ที่จะไม่มีอะไรอยู่ด้านใน
ข้อแตกต่างของ target แต่ละแบบ
ข้อแตกต่างของ target แต่ละแบบนั้น ถ้าเราอ่านเพียงแค่คำอธิบาย ก็ยังไม่ค่อยเข้าใจแน่ชัดเท่าไหร่ ผมเลยลองทำมาเป็นตัวอย่างให้ดู
วิธีไล่สีตัวอักษรด้วย CSS
ในการสร้างคอนเท้นต์ในเว็บไซต์นั้น บางทีเราต้องการไล่สีให้ตัวอักษรเพื่อความสวยงาม โดยเรามีวีธีไล่สีตัวอักษรด้วย CSS แบบนี้
วิธีการใช้สีใน CSS
ในการเขียนเว็บไซต์ CSS เป็นตัวตกแต่งหน้าตาของเว็บไซต์ วิธีการใช้สีใน CSS นั้น มีอยู่หลายวิธี แต่จะขอพูดถึง 4 รูปแบบที่ใช้งานกันบ่อย ๆ
3 CSS Animation ไลบารี่สำหรับนำไปใช้งาน
มันจะง่ายขึ้นถ้าเราไม่ต้องทำเองตั้งแต่ต้น โดยใช้ไลบารี่ต่าง ๆ ที่มีคนทำไว้ให้แล้ว ผมเลยจะมาแนะนำ 5 CSS Animation ไลบารี่ เพื่อให้ทุกคนสามารถนำไปใช้งานกับงานตัวเองได้
[CSS] วิธีเช็คหน้าเว็บของเราตอน Print
บางครั้งในการทำเว็บไซต์ เราต้องเขียน CSS เพื่อใช้สำหรับในการ Print ซึ่งเราสามารถสั่งให้ Browser ใช้งาน CSS สำหรับการ Print โดยเฉพาะได้ในเนื้อหานะครับ
[CSS] Equal Width Menu (ทำเมนูให้กว้างเท่ากัน)
Equal Width Menu หรือการทำให้เมนูกว้างเท่ากันนั้น แต่ละคนคงมีวิธีทำที่แตกต่างกันไป ผมก็ไปเจอมาวิธีนึงซึ่งง่ายๆ เลย ใช้แค่ CSS ก็เรียบร้อยแล้ว
[CSS] พื้นฐานการเรียกใช้งาน CSS
เขียนเกี่ยวกับ CSS มาเยอะแยะ คราวนี้ขอย้อนกลับไกลหน่อย ย้อนกลับมาถึงการเรียกใช้งาน CSS ซึ่งการเรียกใช้งาน CSS นั้นก็มีอยู่ในหลาย ๆ รูปแบบ
[CSS3] ประยุกต์การใช้งานกับ text-shadow
text-shadow นี่เป็น 1 ใน property ของ CSS3 ที่ผมจะมาแนะนำให้ดูกัน ซึ่งตัว text-shadow เป็น property ที่เราอ่านก็รู้เลยว่า เป็นการใส่เงาให้กับตัวอักษร ไปดูกัน
[CSS3] Pseudo-Classes
ถ้าให้ยกตัวอย่าง Pseudo-Classes ที่คนส่วนใหญ่น่าจะรู้จัก ก็คงจะเป็น :hover คราวนี้มาดูว่า CSS3 ได้เพิ่ม Pseudo-Classes อะไรมาให้เราบ้าง
[CSS3] Attribute Selectors
ใน CSS2 นั้นก็มีตัว Attribute Selectors ให้เราใช้งานอยู่แล้ว ส่วนใน CSS3 นั้นได้เพิ่มเติม Attribute Selectors เข้ามาอีก 3 แบบ
[HTML CSS] บางอย่างที่เราอาจจะยังไม่รู้
วันนี้ไปเปิดเจอ Slide ของคุณ Chris Coyier เจ้าของเว็บ CSS-Tricks ได้พูดไว้ในหัวข้อ What We Don’t Know เลยเอามาแชร์ให้ได้อ่าน ได้ดูกันนะครับ >_<
[HTML5 CSS3] Modernizr JavaScript Library สำหรับทำเว็บ HTML5 CSS3
คงน่าเสียดายที่เว็บ HTML5 CSS3 ที่เราทำมามันจะถูกจำกัดให้ Browser เก่า ๆ ใช้งานไม่ได้ ดังนั้นจึงมีตัวช่วยอย่าง Modernizr ออกมา
[HTML5] HTML5 Boilerplate
สำหรับ HTML5 Boilerplate นั้นเปิดตัวในวันที่ 10 สิงหาคม ตอนนี้ก็ถูกพัฒนามาปีกว่าแล้ว เป็น Template สำหรับทำเว็บ HTML5 ที่มันสนับสนุนไปจนถึง IE6 เลย
[CSS] คำสั่งทั่วไปที่ใช้จัดการฟอนต์
หลังจากที่ทำความรู้จักกับคำสั่งที่ใช้จัดการข้อความแล้ว เรามาทำความรู้จักกับคำสั่งที่ใช้จัดการกับตัวอักษรกันนะครับ
[CSS] คำสั่งทั่วไปที่ใช้จัดการกับข้อความ
ข้อความต่าง ๆ ที่ปรากฎในหน้าเว็บของเรานั้น เราสามารถใช้ CSS กำหนดอะไรได้บ้าง ลองไปดูกันนะครับ
[CSS] วิธีใช้ background เบื้องต้น
มาทำความเข้าใจการใช้งานคำสั่ง background สำหรับ css กันนะครับ เพราะเชื่อว่านี่เป็น 1 ในคำสั่งที่ใช้บ่อยเป็นอันดับต้น ๆ และคนหัดทำ css น่าจะรู้จักมันไว้
[HTML CSS] ขี้เกียจเขียน Form โว้ย FormBakery ช่วยด้วย
ไม่รู้ว่าหลาย ๆ คนเป็นเหมือนผมหรือเปล่า แต่ผมเนี่ยโคตรขี้เกียจจะเขียน Code HTML ที่มันเกี่ยวกับ Form ยังไงก็ไม่รู้บอกไม่ถูก เวลาตัดเว็บแล้วเจอ Form เนี่ยจะตัดช้าลงไปอย่างไม่น่าเชื่อ แล้วผมก็ไปเจอเว็บนี้ FormBakery ลองไปดูว่า FormBakery มันทำอะไรเกี่ยวกับ Form ให้เรานะครับ