เราสามารถสร้าง CSS ขึ้นมาใหม่ได้โดยไปที่หน้าต่าง CSS Styles จากนั้นให้ทำการกดไปที่ Icon ที่มีเครื่องหมายบวก (+) หรือเราเรียก icon นี้ว่า New CSS Style ดังจะเห็นได้จากภาพข้างต้น เมื่อทำการกดไปแล้ว โปรแกรมจะทำการเปิดหน้าต่างใหม่ขึ้นมาให้เราทำการตั้งชื่อหรือเลือก TAG ของ HTML มาใช้ในการกำหนดค่า ดังรูป

สำหรับ Version 4 – MX 

สำหรับ Version MX2004 

ที่หน้าต่าง New CSS Style นี้จะมีช่องให้เราตั้งชื่อหรือเลือกรูปแบบของ CSS ได้ ดังนี้
– Selector : เป็นการกำหนดชื่อของ CSS ที่เราต้องการ และที่ช่องนี้จะทำงานสัมพันธ์กับ Type ด้านล่าง หากเราเลือก Type เป็น Redifine HTML TAG ที่ช่อง Selector จะมี List ของ TAG HTML ให้เราเลือกเพื่อทำการกำหนดคุณสมบัติใหม่ให้กับ TAG HTML
– Tyle : เลือกรูปแบบที่เราจะกำหนดคุณสมบัติ CSS มี 3 ค่าให้เลือก คือ
Make Custom Style (class) เป็นการสร้าง CSS ขึ้นมาใหม่โดยเราทำการกำหนดชื่อของ Style ขึ้นเอง เราอาจจะเรียก Style นั้นว่า Class ก็ได้
Redifine HTML Tag เป็นการเลือก TAG ของ HTML ขึ้นมาทำการกำหนดคุณสมบัติใหม่
Use CSS Selector เป็นการกำหนดคุณสมบัติ CSS ให้กับบางจุดของหน้าเว็้บเพจที่เราต้องการ เช่น จุดที่เป็น Link จุดที่เรากำหนด ID ของ TAG นั้น ๆ ไว้ เป็นต้น ใน MX2004 จะใช้ชื่อ option นี้ว่า Advanced ดังรูป
– Define in : เป็นการเลือกว่าเราจะกำหนดการเก็บ CSS ที่เรากำลังจะสร้างขึ้นไว้ในรูปแบบใด มี 2 รูปแบบให้เลือก คือ
1. New Style Sheet File เป็นการเก็บ CSS ไว้ภายนอกเว็บเพจ หรือพูดอีกนัยนึง คือ เป็นการเก็บ CSS ไว้ใน File ต่างหากแยกออกจากเว้บเพจที่เรากำลังทำงานอยู่นี้
2. This document only เป็นการฝั่ง CSS นี้ลงในไฟล์เว็บเพจปัจจุบันนี้ (สำหรับมือใหม่ แนะนำให้เลือกที่ option ไปก่อน เพื่อการเรียนรู้)

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

ที่หน้าต่าง CSS Style Definition นี้เราสามารถกำหนดลักษณะรูปแบบต่าง ๆ ของ CSS ได้มากมาย ซึ่งโปรแกรมได้ทำการแบ่งไว้เป็นหมวด ๆ ดังนี้

– Type เป็นการกำหนดรูปแบบของข้อความที่เป็นลักษณะของ Text หรือ Font ต่าง ๆ
– Background เป็นการกำหนดคุณสมบัติของพื้นหลัง เช่น สีพื้นหลัง ลักษณะรูปภาพของพื้นหลัง เป็นต้น
– Block เป็นการกำหนดขอบเขตในลักษณะของ Block
– Box เป้นการกำหนดขนาดของพื้นที่ในรูปแบบของ Box เราสามารถกำหรดค่าความกว้างความสูงลงไปได้กับคุณสมบัตินี้
– Border เป็นการกำหนดลักษณะคุณสมบัติของเส้นขอบ เช่น รูปแบบของเส้นขอบ สีสรรต่าง ๆ
– List เป็นการกำหนดลักษณะของข้อความในลักษณะ List Menu
– Position เป็นการกำหนดตำแหน่งของวัตถุ (Object) ที่เลือกใช้ CSS นี้
– Extension เป็นการกำหนดค่าเพิ่มเติมของ CSS ในรูปแบบพิเศษ เช่นการกำหนด Cursor ให้เป็นรูปแบบใหม่ตามที่เราต้องการ เป็นต้น

ค่าคุณสมบัติต่าง ๆ จากหน้าต่าง CSS Style Definition เราจะเลือกที่จะกำหนดเพียงคุณสมบัติใด คุณสมบัติหนึ่งก็ได้ ไม่จำเป็นต้องกำหนดให้ครบทุกคุณสมบัติ เมื่อเราได้ทำการกำหนดค่าเป็นที่เรียบร้อยแล้ว ให้ทำการ Clickที่ปุ่ม OK เราก็จะได้ CSS Style ในคุณสมบัติที่เราต้องการ