การเขียนโปรแกรม css-selectors

11

ฉันจะเลือกtrองค์ประกอบทั้งหมดยกเว้นสิ่งแรกtrในตารางด้วย CSS ได้อย่างไร ฉันลองใช้วิธีนี้แต่พบว่าใช้ไม่ได้

257 css css-selectors

2

จะเลือกป้ายกำกับสำหรับ =“ XYZ” ใน CSS ได้อย่างไร

HTML: <label for="email">{t _your_email}:</label> CSS: label { display: block; width: 156px; cursor: pointer; padding-right: 6px; padding-bottom: 1px; } ฉันต้องการเลือกป้ายกำกับตามคุณลักษณะ 'สำหรับ' เพื่อเปลี่ยนแปลงเค้าโครง

256 css css-selectors

4

เลือกองค์ประกอบทุก Nth ใน CSS

เป็นไปได้ที่จะเลือกพูดทุกองค์ประกอบที่สี่ในชุดองค์ประกอบหรือไม่? เช่นฉันมี 16 <div>องค์ประกอบ ... ฉันสามารถเขียนบางอย่างเช่น div:nth-child(4), div:nth-child(8), div:nth-child(12), div:nth-child(16) มีวิธีที่ดีกว่าในการทำเช่นนี้?

242 css css-selectors

8

ใช้สไตล์ CSS กับองค์ประกอบย่อย

ฉันต้องการใช้สไตล์เฉพาะกับตารางใน DIV กับคลาสเฉพาะ: หมายเหตุ: ฉันต้องการใช้ css-selector สำหรับองค์ประกอบของเด็ก ทำไม # 1 จึงใช้งานได้และ # 2 ไม่ได้ 1: div.test th, div.test td, div.test caption {padding:40px 100px 40px 50px;} 2: div.test th, td, caption {padding:40px 100px 40px 50px;} HTML: <html> <head> <style> div.test > th, td, caption {padding:40px 100px 40px 50px;} </style> </head> <body> …

232 css css-selectors

9

ตัวเลือก CSS3: ประเภทแรกที่มีชื่อคลาสหรือไม่

เป็นไปได้ไหมที่จะใช้ตัวเลือก CSS3 :first-of-typeเพื่อเลือกองค์ประกอบแรกที่มีชื่อคลาสที่กำหนด ฉันไม่ประสบความสำเร็จในการทดสอบดังนั้นฉันจึงคิดว่าไม่ รหัส ( http://jsfiddle.net/YWY4L/ ): p:first-of-type {color:blue} p.myclass1:first-of-type {color:red} .myclass2:first-of-type {color:green} <div> <div>This text should appear as normal</div> <p>This text should be blue.</p> <p class="myclass1">This text should appear red.</p> <p class="myclass2">This text should appear green.</p> </div> เรียกใช้ข้อมูลโค้ดซ่อนผลลัพธ์ขยายตัวอย่างข้อมูล

230 css css-selectors

4

ชื่อคลาสในตัวเลือก CSS เป็นตัวพิมพ์เล็กหรือใหญ่?

ฉันอ่านต่อไปทุกที่ว่า CSS ไม่ได้ตรงตามตัวพิมพ์ใหญ่ - เล็ก แต่ฉันมีตัวเลือกนี้ .holiday-type.Selfcatering สิ่งที่เมื่อฉันใช้ใน HTML ของฉันแบบนี้จะถูกหยิบขึ้นมา <div class="holiday-type Selfcatering"> หากฉันเปลี่ยนตัวเลือกด้านบนเช่นนี้ .holiday-type.SelfCatering จากนั้นสไตล์จะไม่ถูกหยิบขึ้นมา มีคนบอกเรื่องโกหก

229 html css css-selectors

9

วิธีการรวมคลาสและ ID ในตัวเลือก CSS?

หากฉันมี div ต่อไปนี้: <div class="sectionA" id="content"> Lorem Ipsum... </div> มีวิธีกำหนดสไตล์ที่แสดงออกถึงความคิด "A div with id='content'AND class='myClass'" หรือไม่? หรือว่าคุณจะไปทางเดียวหรืออื่น ๆ เช่นเดียวกับใน <div class="content-sectionA"> Lorem Ipsum... </div> หรือ <div id="content-sectionA"> Lorem Ipsum... </div>

221 css css-selectors

9

ใน CSS อะไรคือความแตกต่างระหว่าง“.” และ“ #” เมื่อประกาศชุดของสไตล์?

อะไรคือความแตกต่างระหว่าง#และ.เมื่อประกาศชุดรูปแบบสำหรับองค์ประกอบและความหมายที่เข้ามาเล่นเมื่อตัดสินใจเลือกรูปแบบใด

219 css css-selectors

3

อะไรคือความแตกต่างระหว่าง * และ * | * ใน CSS?

ใน CSS *จะจับคู่องค์ประกอบใด ๆ *|*มีการใช้บ่อยครั้งแทนที่จะ*จับคู่องค์ประกอบทั้งหมด โดยทั่วไปจะใช้เพื่อการทดสอบ ความแตกต่างระหว่าง*และ*|*ใน CSS คืออะไร?

211 css css-selectors namespaces

5

ไวยากรณ์สำหรับตัวเลือกใน CSS สำหรับองค์ประกอบต่อไปคืออะไร?

ถ้าฉันมีแท็กส่วนหัว <h1 class="hc-reform">title</h1> h1.hc-reform{ float:left; font-size:30px; color:#0e73bb; font-weight:bold; margin:10px 0px; } <p>stuff here</p>และหลังจากนั้นผมมีย่อหน้า ฉันจะแน่ใจได้อย่างไรว่าใช้ CSS ที่ทุก<p>แท็กที่ตามh1.hc-reformมาใช้:clear:both; จะเป็น: h1.hc-reform > p{ clear:both; } ด้วยเหตุผลบางอย่างที่ไม่ทำงาน

200 html css css-selectors siblings

4

วิธีรับ CSS เพื่อเลือก ID ที่ขึ้นต้นด้วยสตริง (ไม่ใช่ใน Javascript)

หาก HTML มีองค์ประกอบดังนี้: id="product42" id="product43" ... ฉันจะจับคู่ id ทั้งหมดที่เริ่มต้นด้วย "ผลิตภัณฑ์" ได้อย่างไร ฉันเคยเห็นคำตอบที่ใช้จาวาสคริปต์อย่างแน่นอน แต่จะทำอย่างไรกับ CSS เท่านั้น?

194 html css css-selectors

4

ตัวเลือก CSS นี้คืออะไร? [ระดับ * =“ช่วง”]

ฉันเห็นตัวเลือกนี้ใน Twitter Bootstrap: .show-grid [class*="span"] { background-color: #eee; text-align: center; border-radius: 3px; min-height: 30px; line-height: 30px; } ไม่มีใครรู้ว่าสิ่งที่เรียกว่าเทคนิคนี้และมันทำอะไร?

190 css css-selectors

6

Angular 2: วิธีจัดองค์ประกอบองค์ประกอบโฮสต์ขององค์ประกอบได้อย่างไร

ฉันมีองค์ประกอบใน Angular 2 เรียกว่า my-comp: <my-comp></my-comp> หนึ่งลักษณะสไตล์องค์ประกอบโฮสต์ขององค์ประกอบนี้ใน Angular 2 ได้อย่างไร ในพอลิเมอร์คุณจะต้องใช้ตัวเลือก ": host" ฉันลองเป็นแบบ Angular 2 แต่มันไม่ทำงาน :host { display: block; width: 100%; height: 100%; } ฉันยังลองใช้ส่วนประกอบเป็นตัวเลือก: my-comp { display: block; width: 100%; height: 100%; } วิธีการทั้งสองดูเหมือนจะไม่ทำงาน ขอบคุณ

189 css angular css-selectors angular-components

10

ฉันสามารถใช้สไตล์ CSS กับชื่อองค์ประกอบได้หรือไม่

ขณะนี้ฉันกำลังทำงานในโครงการที่ฉันไม่สามารถควบคุม HTML ที่ฉันใช้สไตล์ CSS ได้ และ HTML นั้นไม่มีป้ายกำกับที่ดีมากในแง่ที่ว่ามีการประกาศ ID และคลาสไม่เพียงพอที่จะแยกความแตกต่างระหว่างองค์ประกอบ ดังนั้นฉันกำลังมองหาวิธีที่ฉันสามารถใช้สไตล์กับวัตถุที่ไม่มีแอตทริบิวต์ id หรือคลาส บางครั้งไอเท็มฟอร์มมีแอตทริบิวต์ "name" หรือ "value": <input type="submit" value="Go" name="goButton"> มีวิธีที่ฉันสามารถใช้สไตล์ตาม name = "goButton" หรือไม่? แล้ว "คุณค่า" ล่ะ? มันเป็นสิ่งที่ยากที่จะค้นพบเพราะการค้นหาของ Google จะค้นหาอินสแตนซ์ทุกประเภทที่คำกว้าง ๆ เช่น "ชื่อ" และ "ค่า" จะปรากฏในหน้าเว็บ ฉันสงสัยว่าคำตอบคือไม่ ... แต่บางทีใครบางคนอาจมีแฮ็คที่ฉลาด? คำแนะนำใด ๆ ที่จะได้รับการชื่นชมอย่างมาก

176 html css css-selectors

6

CSS ตัวเลือกลูกคนสุดท้าย: เลือกองค์ประกอบสุดท้ายของคลาสที่เฉพาะเจาะจงไม่ใช่ลูกคนสุดท้ายในแม่

<div class="commentList"> <article class="comment " id="com21"></article> <article class="comment " id="com20"></article> <article class="comment " id="com19"></article> <div class="something"> hello </div> </div> ฉันต้องการที่จะเลือก#com19? .comment { width:470px; border-bottom:1px dotted #f0f0f0; margin-bottom:10px; } .comment:last-child { border-bottom:none; margin-bottom:0; } ที่ไม่ทำงานตราบใดที่ฉันมีอีกdiv.somethingเป็นลูกคนสุดท้ายที่เกิดขึ้นจริงใน commentList มันเป็นไปได้ที่จะใช้ตัวเลือกสุดท้ายเด็กในกรณีนี้เพื่อเลือกปรากฏตัวครั้งสุดท้ายของarticle.comment? jsFiddle

176 html css css-selectors

คำถามติดแท็ก css-selectors