สมาชิกเว็บบอร์ด

สมัครสมาชิก | ลืมรหัสผ่าน
โพล
ปฎิทิน
September 2023
Sun Mon Tue Wed Thu Fri Sat
     
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
สินค้า
สินค้าแนะนำ
สินค้าขายดี

Tutorial - การแก้ไข CSS

Tutorial - การแก้ไข CSS
อ้างอิง อ่าน 7763 ครั้ง / ตอบ 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 และทำตามขั้นตอนต่อไปดังนี้
  1. ทำการ login เข้าสู่ระบบจัดการ
  2. หลังจาก login แล้ว ที่เมนูด้านซ้ายจะเป็นเมนูสำหรับจัดการส่วนต่างๆของระบบ ให้ท่านคลิกตามขั้นตอนดังรูปออกแบบเว็บไซต์ออกแบบเว็บไซต์หมายเลข 1 ตัวเลือกสถานะการใช้งาน ถ้าส่วนนี้ถูกปิดใช้งานอยู่จำเป็นต้องเปิดการใช้งานก่อน
    หมายเลข 2 ช่องสำหรับเพิ่ม CSS เพิ่มเติม
  3. เมื่อเพิ่ม CSS เรียบร้อยแล้วให้กด Submit เพื่อบันทึกข้อมูล
ผลลัพท์ที่ได้จากการเพิ่ม CSS ในส่วนดังกล่าว จะได้ขอบที่โค้งมนสวยงาม
ออกแบบเว็บไซต์

คำค้นหาที่เกี่ยวข้อง: ออกแบบเว็บ, ออกแบบเว็บไซต์, เว็บสำเร็จรูป, เว็บไซต์สำเร็จรูป, ทำเว็บ, ทำเว็บไซต์
 
vitamin [49.0.72.xxx] เมื่อ 14/01/2017 13:57