เครื่องมือ CSS Beautify- เครื่องมือจัดรูปแบบและปรับแต่ง CSS ออนไลน์ฟรี

Input data
bfotool loadding
Output data
bfotool loadding

CSS คืออะไร?

  • CSS ย่อมาจาก Cascading Style Sheets
  • CSS อธิบายว่าองค์ประกอบ HTML จะถูกแสดงบนหน้าจอ กระดาษ หรือในสื่ออื่นๆ อย่างไร
  • CSS ช่วยประหยัดงานได้มาก สามารถควบคุมเค้าโครงของเว็บเพจหลายหน้าพร้อมกันได้
  • สไตล์ชีตภายนอกจะถูกเก็บไว้ในไฟล์ CSS

คุณใช้เมื่อไหร่

การเขียน CSS Style Sheets มักจะทำให้การย่อหน้า ระยะห่าง และการจัดรูปแบบอื่นๆ ไม่เป็นระเบียบ นอกจากนี้ นักพัฒนาหลายคนยังมักทำงานในโครงการเดียวกันโดยใช้เทคนิคการจัดรูปแบบที่แตกต่างกัน เครื่องมือนี้มีประโยชน์ในการทำให้การจัดรูปแบบของไฟล์มีความสอดคล้องกัน นอกจากนี้ CSS Style Sheets ยังมักถูกย่อหรือทำให้สับสน คุณสามารถใช้เครื่องมือนี้เพื่อทำให้โค้ดดูสวยงามและอ่านง่าย เพื่อให้แก้ไขได้ง่ายขึ้น

ตัวอย่างการตกแต่ง CSS

CSS Style Sheets แบบย่อด้านล่างนี้:

.headbg{margin:0 8px }a:link,a:focus{color:#00c }a:active{color:red }

กลายเป็นงดงามอย่างนี้:

.headbg{  
     margin:0 8px   
 }  
 a:link,a:focus{  
     color:#00c   
 }  
 a:active{  
     color:red   
 }