Bagaimana untuk Menambah Pemisah Baris ke ::selepas atau ::sebelum Kandungan Unsur Pseudo dalam CSS?

Menambah Pemisah Baris pada ::selepas atau ::sebelum Kandungan Unsur Pseudo

Soalan:

Bagaimana anda menambah berbilang baris pada sifat kandungan a ::after atau ::before pseudo-element apabila akses kepada markup dihadkan kepada CSS?

Jawapan:

Sifat 'kandungan' membenarkan pemisah baris disisipkan menggunakan "A" escape urutan. Walau bagaimanapun, untuk mengelakkan pembalut baris, tetapkan sifat 'ruang putih' kepada 'pra' atau 'pra-bungkus'.

Contoh:

#headerAgentInfoDetailsPhone:after {
  content: "Office: XXXXX \A Mobile: YYYYY ";
  white-space: pre;
}

Untuk melarikan diri yang lebih mantap, gunakan " 0000a" dan bukannya "A" untuk mengendalikan input sewenang-wenangnya, seperti yang dilihat dalam kod ini:

function addTextToStyle(id, text) {
  return `#${id}::after { content: "${text.replace(/"/g, '\"').replace(/\n/g, '\00000a')} }"`;
}

Atas ialah kandungan terperinci Bagaimana untuk Menambah Pemisah Baris ke ::selepas atau ::sebelum Kandungan Unsur Pseudo dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!