CSS การใช้งาน Selectors (Grouping Selectors) เลือกกรอบขอบเขตหลายๆตัว

CSS Knowledge เป็น บอร์ดรวามความรู้ CCC เน้นบทความ แนวทางการเขียนโปรแกรม บันทึกกันลืม เพื่อให้สมาชิกได้เขียนความรู้ที่ตัวเองมีให้สมาชิกท่านอื่นๆ ได้ เข้ามาอ่าน และ ไว้อ่านเองกันลืมด้วย

Moderators: mindphp, ผู้ดูแลกระดาน

thitikorn_lp
PHP Super Hero Member
PHP Super Hero Member
Posts: 680
Joined: 28/07/2014 10:24 am

CSS การใช้งาน Selectors (Grouping Selectors) เลือกกรอบขอบเขตหลายๆตัว

Post by thitikorn_lp » 11/02/2015 3:17 pm

CSS การเรียกใช้งาน Grouping Selectors

Selector จะทำให้เราสามารถเลือกได้ว่าต้องการจะจัดการกับองค์ประกอบในหน้า HTML ของเราได้อย่างไร ต้องการกำหนดรูปแบบที่ตรงไหน ในตอนนี้จะเป็นการกำหนด selector โดยจัดเป็น group

กำหนดโดยใช้ "group" รวมกลุ่มของลักษณะที่มีรูปแบบเหมือนกัน (Grouping Selectors)
การใช้ Grouping Selectors ก็ต่อเมื่อมี element หลายๆ ตัว ที่มีรูปแบบเหมือนกัน เช่น ตำแหน่งเหมือนกัน, สีเหมือนกัน เป็นต้น

Code: Select all

h1 {
    text-align: center;
    color: blue;
}

h2 {
    text-align: center;
    color: blue;
}

p {
    text-align: center;
    color: blue;
}
เราสามารถรวมกลุ่มของ element เหล่านี้ได้ โดยการรวมกลุ่มให้มัน โดยใช้เครื่องหมายจุลภาค ( , ) คั่น

Code: Select all

h1, h2, p {
         text-align: center;
         color: blue;
         }

การเรียกใช้ก็เรียกใช้ปกติ เช่น <p> ข้อความ </p>

Code: Select all

<!DOCTYPE html>
<html>
<head>
<style>
h1, h2, p {
    text-align: center;
    color: blue;
}
</style>
</head>
<body>

<h1>Hello MindPHP!</h1>
<h2>MindPHP!</h2>
<p>www.mimdphp.com</p>

</body>
</html>
ผลที่ได้
2015-02-11_15-15-12.png
2015-02-11_15-15-12.png (17.2 KiB) Viewed 401 times
Image

  • Similar Topics
    Replies
    Views
    Last post

Return to “CSS Knowledge”

Who is online

Users browsing this forum: No registered users and 36 guests