| Tutorial - การแก้ไข CSS |
|
|
|
อ้างอิง
อ่าน 7651 ครั้ง / ตอบ 0 ครั้ง
|
|
|
สำหรับบทความนี้จะแนะนำเกี่ยวกับ การแก้ไข CSS เพื่อเปลี่ยนสี, รูปแบบ หรือหน้าตาเว็บแบบเฉพาะส่วนให้เป็นไปตามต้องการ
การปรับแต่ง CSS ของเว็บจำเป็นจะต้องมีพื้นฐานเกี่ยวกับ CSS อยู่บ้างหรือใช้งาน web browser อย่าง Google Chrome, Firefox อย่างคล่องแคล่ว เพราะจะต้องใช้ในการปรับแต่ง+แก้ไข CSS ในส่วนต่อไปนี้
ขั้นตอนในการปรับ CSS โดยใช้ Firefox
จากรูปตัวอย่างนี้จะปรับให้ มุมของกรอบข้อมูลมูลนี้มีความโค้งมนสวยงาม
ถ้าใช้ Firefox ให้เปิดหน้าเว็บไซต์ของท่านแล้วกด ctrl + shift + c จะปรากฎ inspector สำหรับช่วยแก้ไขหน้าเว็บแบบนี้ ให้ใช้ cursor ชี้ไปยังส่วนที่ต้องการจะปรับ
หมายเลข 1 เป็นส่วนที่เราใช้ cursor ชี้เพื่อดู id หรือ class ของ CSS เพื่อเอาไปปรับแต่ง ในรูปนี้ id ชื่อ content-widget ที่เราจะใช้ในการปรับแต่ง
หมายเลข 2 แสดงชื่อ id หรือ class ของ CSS และ style ที่อยู่ในเครื่องหมายก้ามปู {}
การใช้ CSS ให้เกิดความโค้งมนจะต้องใส่ border-radius: ค่าความโค้งเป็น px; เช่น border-radius: 5px;
ต่อไปให้ท่าน login และทำตามขั้นตอนต่อไปดังนี้
- ทำการ login เข้าสู่ระบบจัดการ
- หลังจาก login แล้ว ที่เมนูด้านซ้ายจะเป็นเมนูสำหรับจัดการส่วนต่างๆของระบบ ให้ท่านคลิกตามขั้นตอนดังรูป
  หมายเลข 1 ตัวเลือกสถานะการใช้งาน ถ้าส่วนนี้ถูกปิดใช้งานอยู่จำเป็นต้องเปิดการใช้งานก่อน
หมายเลข 2 ช่องสำหรับเพิ่ม CSS เพิ่มเติม
- เมื่อเพิ่ม CSS เรียบร้อยแล้วให้กด Submit เพื่อบันทึกข้อมูล
ผลลัพท์ที่ได้จากการเพิ่ม CSS ในส่วนดังกล่าว จะได้ขอบที่โค้งมนสวยงาม
คำค้นหาที่เกี่ยวข้อง: ออกแบบเว็บ, ออกแบบเว็บไซต์, เว็บสำเร็จรูป, เว็บไซต์สำเร็จรูป, ทำเว็บ, ทำเว็บไซต์
|
| |
vitamin
[49.0.72.xxx] เมื่อ 14/01/2017 13:57
|
