การสร้าง Cascading Style Sheets (css) = Dreamweaver โดย พ ย า ย า ม ดอทคอม

การที่เรานั้นนำ css (Cascading Style Sheets) มาใช้ร่วมกับการสร้างเว็บ นั้นจะช่วยอำนวยความสะดวก หากว่าเรานั้นต้องการที่ update รูปร่างหน้าตารูปแบบอักษร ลิงค์ ตาราง และอื่นๆ อีก บ่อย ๆ เจ้าตัว css ช่วยคุณได้ครับ แต่ว่าคุณยังไม่รู้ว่าเจ้าตัวนี้คืออะไร ผมก็อยากแนะนำให้ทุกคนที่ยังไม่รู้ถึงประโยชน์ของเจ้าตัวนี้ควรศึกษา ภาษา css ด้วยก็ดีนะครับที่ http://css.pyayam.com (หากว่าศึกษาตัวนี้ได้เข้าใจแล้ว รูปแบบเว็บของคุณสวยงามมากเลยครับ ก็ดูตัวอย่างเว็บ Pyayam.com ของผมซิครับ ให้ css ร่วมด้วยนะครับ ตรง scroll bar เปลี่ยนสีได้เพราะ css การทำ link โดยไม่ต้องมีขีดเส้นใต้ก็เพราะ css ) เรามาดูการนำ css มาใช้งานเลยนะครับ แต่ว่าเป็นแบบพื้น ๆ ครับ ตรงนี้ผมจะอกเฉพาะสิ่งที่เกี่ยวกับตัวอักษร ที่ http://css.pyayam.com นั้นเนื้อหาของ css เพียบเลย

แล้วจะปรากฏ Dialog Box ให้เรา save ชื่อ file เช่น pyayam .css (นามสกุลของ file)

การกำหนดตัวอักษร

เมื่อเราไม่ได้ทำการระบุ รูปแบบ ขนาด สี ของตัวอักษรในเว็บเพจ (แต่ว่าเรานั้นทำการระบุไว้ที่ file .css) นั้นตัวอักษร ก็จะเป็นไปเหมือนกันกับที่ระบุใน file .css

หลังจากที่สร้าง file .css แล้วนั้นจะเป็น Dialog Box : Style Definition เลือก Type ด้านซ้าย ในหัวข้อ Type ด้านขวามีรายละเอียดดังนี้

แล้วทำการ Preview โดยการกด F12 ดูครับว่าเป็นเหมือนกันกับที่ผมได้โม้ไว้หรือเปล่า

หมายเหตุ
หากต้องการรู้ว่าค่าต่าง ๆ นั้นคืออะไรบ้าง ควรศึกษาเรื่อง css ประกอบด้วยที่ http://css.pyayam.com ครับเนื้อหาของที่นี่มีเพียบเลยครับประมาณ 90 หน้า แต่ว่าอย่าเพิ่งขี้เกียจก่อนนะครับ หากว่าศึกษาไปแล้วจะชอบ .css เองครับ

และนี้ก็คือ code ที่นำ file .css มาใช้งานร่วมกับ Dreamweaver ครับ แต่ว่า code จริงนั้นยาวกว่านี้

รับทำเว็บไซต์ครบวงจร กับมืออาชีพ กับ webUB.com

รับเขียน php asp.net vb VB.NET visual basic c# xml asp BPELcrm CRYTRAL REPORT c sharp database erp Java mrp mysql Oracle SQLServer SQL SERVER