ตัวเลือก CSS สำหรับลูกอื่นที่ไม่ใช่ลูกคนแรกและลูกคนสุดท้าย


106

ฉันกำลังสร้างเว็บไซต์ขั้นสูง คำถามของฉัน: เป็นไปได้ไหมที่จะเลือกเด็กคนอื่น ๆ ทั้งหมดยกเว้น:first-childและ:last-child? ฉันรู้ว่ามี:not()ตัวเลือก แต่ใช้ไม่ได้กับมากกว่าหนึ่งตัวที่ไม่ได้อยู่ในวงเล็บ นี่คือสิ่งที่ฉันมี:

#navigation ul li:not(:first-child, :last-child) {
    background: url(images/UISegmentBarButtonmiddle@2x.png);
    background-size: contain;
}

คุณกล้าหาญมากที่จะใช้สิ่งนี้ โปรดทราบว่ามันจะใช้งานได้กับเบราว์เซอร์ที่ทันสมัยเท่านั้นและจะไม่สามารถใช้งานได้กับโปรแกรมป้องกันเบราว์เซอร์ที่ทุกคนใช้อยู่
กำจัด

2
@Radu: "ฉันกำลังสร้างเว็บไซต์ขั้นสูง" ไม่แปลกใจเลยที่นั่น ...
BoltClock

1
@BoltClock ใช่แค่บอกว่า ... คำเตือน. แต่อย่างไรก็ตามหากเป้าหมายคือ iOS Safari ตามชื่อของภาพที่แนะนำก็น่าจะปลอดภัย
กำจัด

1
ตอนนี้ฉันเห็นแล้วว่าทำไมคำถามนี้ดูคุ้นเคย ... stackoverflow.com/questions/7403129/combining-not-selectors
BoltClock

"ต่อต้านเบราว์เซอร์"? นั่นคือ Google Ultron ใหม่ที่ฉันได้ยินอยู่เรื่อย ๆ ใช่ไหม
Jonathan Dumaine

คำตอบ:


267

ลอง#navigation ul li:not(:first-child):not(:last-child).


1
คุณเจ๋งจริงๆ! ขอบคุณ!
Daniel

1
rofl ความโง่เขลาของฉันnot()แม้จะลองทำก่อน googling: P อัจฉริยะ
SidOfc

1
ที่ผิดปกติ: not (A and B)ไม่เท่ากับที่ค่อนข้างจะ(not A) and (not B) (not A) or (not B)มันไม่ทำงาน.
Hibou57

2
สิ่งที่ Salman Abbas พูดนั้นถูกต้อง คุณกำลังคิดถึงเครื่องหมายจุลภาค #navigation ul li: not (: first-child), #navigation ul li: not (: last-child)
user847074

20

แน่นอนว่าจะใช้งานได้คุณต้องใช้ตัวเลือก 'not' สองตัว

#navigation ul li:not(:first-child):not(:last-child) {

มันจะต่อจากลูกคนแรกโดยพูดว่า "ไม่ใช่ลูกคนแรก" และ "ไม่ใช่ลูกคนสุดท้าย"

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.