มีตัวเลือก CSS สำหรับโหนดข้อความหรือไม่

173

สิ่งที่ฉันต้องการจะทำ (ไม่ใช่ใน IE อย่างชัดเจน) คือ:

p:not(.list):last-child + :text {
  margin-bottom: 10px;
}

ซึ่งจะให้ระยะขอบโหนดข้อความ (เป็นไปได้หรือไม่) ฉันจะได้รับโหนดข้อความด้วย CSS ได้อย่างไร

css css-selectors

— Rudie
แหล่งที่มา

คุณสามารถประมาณได้ว่าจะใช้โดยประมาณ::first-lineตามชื่อที่แนะนำ แต่จะใช้กับข้อความบรรทัดแรก (นอกจากนี้ฉันคิดว่ามีเพียงคุณสมบัติบางอย่างเท่านั้นที่สามารถตั้งค่าได้)

— Mark Garcia

คำตอบ:

114

โหนดข้อความไม่สามารถมีระยะขอบหรือสไตล์อื่น ๆ ที่ใช้กับพวกเขาดังนั้นสิ่งที่คุณต้องการใช้สไตล์ที่จะต้องอยู่ในองค์ประกอบ ถ้าคุณต้องการบางส่วนของภายในข้อความขององค์ประกอบของคุณที่จะเรียกขานแตกต่างกันห่อไว้ในspanหรือdivยกตัวอย่างเช่น

— จาค็อบ
แหล่งที่มา

ฉันยังคงขาดหายไป :: ก่อนและ :: หลังจากบนโหนดข้อความ

— shabunc

I'm nevertheless desperately missing ::before and ::after on text nodes.จริง พวกเขาอาจจะไม่เอาการจัดรูปแบบ contentแต่แน่นอนพวกเขาใช้เวลา

— Synetech

เป็นคำถามที่เหมาะสมอย่างยิ่งที่จะถามวิธีกำหนดเป้าหมายโหนดข้อความ ฉันรู้ว่า OP กล่าวว่า "margin" โดยเฉพาะ แต่เป็นลักษณะอื่น ๆ ที่สามารถใช้กับโหนดข้อความและคุณอาจต้องการใช้กับโหนดข้อความไม่ใช่โหนดหลัก ตัวอย่างเช่นสมมติว่าฉันต้องการเส้นขอบด้านล่างใต้ข้อความ การนำไปใช้ด้านล่างของเส้นขอบกับโหนดข้อความจะมีผลลัพธ์ที่ต้องการ แต่การใช้มันเพื่อบอกว่า div div นั้นจะสร้างเส้นขอบด้านล่างรอบ div ทั้งหมด น่าเสียดายที่ CSS ไม่อนุญาตให้คุณกำหนดเป้าหมายโหนดข้อความด้วยการเพิ่มองค์ประกอบ HTML ... อย่างน้อยตอนนี้

— VKK

คุณสามารถตั้งค่าแบบอักษรให้ใช้งานได้อย่างแน่นอน แต่สไตล์อื่น ๆ ที่ไม่ได้ใช้

— Hamid Bahmanabady

คุณสามารถทำสิ่งนี้ได้เฉพาะตอนนี้stackoverflow.com/questions/10645552/…

— fearis

คุณไม่สามารถกำหนดเป้าหมายโหนดข้อความด้วย CSS ฉันอยู่กับคุณ ฉันหวังว่าคุณจะทำได้ ... แต่คุณทำไม่ได้ :(

หากคุณไม่ล้อมโหนดข้อความในเครื่องหมาย<span> คล้าย @Jacobคุณสามารถให้องค์ประกอบล้อมรอบpaddingแทนได้margin:

HTML

<p id="theParagraph">The text node!</p>

CSS

p#theParagraph
{
    border: 1px solid red;
    padding-bottom: 10px;
}

— Richard JP Le Guen
แหล่งที่มา