Apakah ada pemilih CSS untuk simpul teks?

173

Apa yang ingin saya lakukan (bukan di IE jelas) adalah:

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

Yang akan memberikan margin teks node. (Apakah itu mungkin?) Bagaimana saya mendapatkan simpul teks dengan CSS?

css css-selectors

— Rudie
sumber

Anda dapat memperkirakan menggunakan ::first-line, meskipun seperti namanya, itu hanya berlaku untuk baris teks pertama. (Juga, saya pikir hanya beberapa properti dapat diatur di atasnya)

— Mark Garcia

Jawaban:

114

Node teks tidak boleh memiliki margin atau gaya lain yang diterapkan padanya, jadi apa pun yang Anda butuhkan gaya harus diterapkan dalam suatu elemen. Jika Anda ingin beberapa teks di dalam elemen Anda ditata dengan gaya yang berbeda, bungkus dengan spanatau div, misalnya.

— Yakub
sumber

Namun saya sangat kehilangan :: sebelum dan :: setelah pada node teks.

— shabunc

I'm nevertheless desperately missing ::before and ::after on text nodes.Memang. Mereka mungkin tidak mengambil format, tetapi mereka tentu saja mengambil content.

— Synetech

Ini adalah pertanyaan yang masuk akal untuk bertanya bagaimana menargetkan simpul teks. Saya menyadari OP secara khusus mengatakan "margin" tetapi mereka adalah gaya lain yang dapat diterapkan pada simpul teks dan yang mungkin ingin Anda terapkan pada simpul teks dan bukan simpul induk. Sebagai contoh, katakan saya ingin bagian bawah perbatasan di bawah teks. Menerapkan batas bawah ke simpul teks akan memiliki hasil yang diinginkan, tetapi menerapkannya untuk mengatakan div induk, akan membuat batas bawah di sekitar seluruh div. Sayangnya tentu saja, CSS tidak membiarkan Anda menargetkan simpul teks dengan menambahkan elemen HTML ... setidaknya sampai sekarang.

— VKK

Anda dapat mengatur font untuk itu, tentu berhasil, tetapi gaya lain apa pun tidak diterapkan

— Hamid Bahmanabady

Anda hanya dapat melakukan hal-hal seperti ini untuk sekarang stackoverflow.com/questions/10645552/…

— fearis

Anda tidak dapat menargetkan node teks dengan CSS. Aku bersamamu; Saya berharap Anda bisa ... tetapi Anda tidak bisa :(

Jika Anda tidak membungkus simpul teks dalam saran <span> seperti @Jacob , Anda bisa memberikan elemen sekitarnya paddingsebagai lawan dari margin:

HTML

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

CSS

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

— Richard JP Le Guen
sumber