การใช้ CSS selectors เพื่ออ้างอิง h1 tag ที่อยุ่ข้างใน div


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

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

User avatar
bankjittapol
PHP Super Member
PHP Super Member
Posts: 344
Joined: 21/10/2019 10:19 am

การใช้ CSS selectors เพื่ออ้างอิง h1 tag ที่อยุ่ข้างใน div

Post by bankjittapol » 13/11/2019 6:49 pm

การใช้ CSS selectors เพื่ออ้างอิง h1 tag ที่อยุ่ข้างใน div
การใช้ Selectors จะใช้เพื่อให้เราสามารถ เลือกกำหนด style ให้แก่ elements ต่างๆที่เราต้องการได้ ไม่ว่าจะกำหนด หลาย elements หรือเฉพาะเจาะจงที่ตำแหน่งนั้นๆ ก็สามารถทำได้

ซึ่งการอ้างอิง ที่ใช้กันมากๆ ก็มี อ้างอิง โดย class id html tag เป็นต้น
ซึ่งสามารถศึกษาเพิ่มเติมได้ ดังนี้
CSS การใช้งาน Selectors (Grouping Selectors)
CSS การใช้งาน Selectors (id Selector)
CSS การใช้งาน Selectors (class Selector)

ตัวอย่าง แท็ค h1 ซึ่งอยู่ใน div ซ้อนอีกชั้น
Image

Code: Select all

<div class="outside">
  <div class="inside">
    <h1>CSS SELECTORS</h1>
  </div>
</div>
กำหนด CSS ให้ h1

Code: Select all

<style media="screen">
  .outside .inside h1{
    color: red;
    font-weight: bold;
  }
</style>
.outside อ้างอิง class div ชั้นแรก
.inside อ้างอิง class div ชั้นใน
h1 อ้างอิง h1 tag

ผลลัพธ์ที่ได้
Image

User avatar
mindphp
ผู้ดูแลระบบ MindPHP
ผู้ดูแลระบบ MindPHP
Posts: 22609
Joined: 22/09/2008 6:18 pm
Contact:

Re: การใช้ CSS selectors เพื่ออ้างอิง h1 tag ที่อยุ่ข้างใน div

Post by mindphp » 13/11/2019 6:52 pm

ศึกาเพิ่มเติมบทเรียน css
https://www.mindphp.com/%E0%B8%9A%E0%B8 ... 9-css.html
ติดตาม VDO: http://www.youtube.com/c/MindphpVideoman
ติดตาม FB: https://www.facebook.com/pages/MindphpC ... 9517401606
หมวดแชร์ความรู้: https://www.mindphp.com/forums/viewforum.php?f=29
รับอบรม และพัฒนาระบบ: https://www.mindphp.com/forums/viewtopic.php?f=6&t=2042

Post Reply

Return to “CSS Knowledge”

Users browsing this forum: No registered users and 2 guests