[英]How can I add the information after the element but not its content easily?
我使用:after在div :after添加內容，但是您知道它將添加到div的文本中，但不會添加到div的邊框旁邊。
#div2 { width: 300px; height: 100px; background-color: beige; } #div2:after { content: "a"; top: 5px; bottom: 5px; right: 5px; width: 1px; background-color: black; }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>title</title> <link rel="stylesheet" href="styles/index.css" type="text/css"> </head> <body> <div id="div2"> div2-text </div> </body> </html>
我可以輕松地在div的框架后添加邊框（您可以看到div的背景色）嗎？
你是這個意思嗎？
#div2 { position: relative; width: 300px; height: 100px; background-color: beige; } #div2:after { position: absolute; content: ""; top: 5px; right: -5px; width: 1px; height: 90px; background-color: black; }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>title</title> <link rel="stylesheet" href="styles/index.css" type="text/css"> </head> <body> <div id="div2"> div2-text </div> </body> </html>
建議您在擁有內容的div之后再創建一個空div，但絕對位置的解決方案不好/沒有用，因為您的網站上會放置更多內容，然后它們會出現在“ a”文字或您將在：after之后添加的任何文本。 因此，只需創建另一個div :-)
將文本放在span然后將:after應用於span
#div2 { width: 300px; height: 100px; background-color: beige; } #div2 span:after { content: "after"; }
<div id="div2"> <span>div2-text</span> </div>
如何選擇元素的：before和：after（不是其內容）？
[英]How do I select :before and :after of an element (not its content)?
當內容更寬時，如何使元素保持在瀏覽器的窗口寬度之內？
[英]How can I get an element to stay within the browser's window width when its content is wider?
如何動態調整DIV元素的寬度以適應其文本內容？
[英]How can I dynamically resize a DIV element's width to fit its text content?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.