HTML错误挑战：如果使用占位符，contenteditable div的大光标
测试下面的代码，您将在contenteditable div中找到一个大光标。如果删除规则HTML错误挑战：如果使用占位符，contenteditable div的大光标,html,css,Html,Css,测试下面的代码，您将在contenteditable div中找到一个大光标。如果删除规则：empty:before，光标问题似乎已解决，但占位符也消失了。所以我想知道如何使光标保持正常大小，但同时保留占位符 <html> <div id="comment_box" contenteditable="true" autocomplete="off" spellcheck="false" placeholder="Click me to see Omg what a b
：empty:before <html>
<div id="comment_box" contenteditable="true" autocomplete="off" spellcheck="false" placeholder="Click me to see Omg what a big cursor"></div>
<style>
#comment_box{
text-align: center;
background-color: white;
/*position:relative;*/
border: 1px solid orange;
/*height:60px;*/
width: 500px;
padding: 10px;
color:black;
border-radius:5px;
/*font-size:18px;*/
display: inline-block;
text-align: left;
vertical-align: bottom;
/*border-color:yellow;*/
}
#comment_box:focus{
outline-style:solid;
outline-color:orange;
outline-width:0px;
}
[contenteditable=true]:empty:before{
content: attr(placeholder);
color: #aaa;
display: block; For Firefox
}
</style>
</html>
#评论框{
文本对齐：居中；
背景色：白色；
/*位置：相对位置*/
边框：1px实心橙色；
/*高度：60px*/
宽度：500px；
填充：10px；
颜色：黑色；
边界半径：5px；
/*字号：18px*/
显示：内联块；
文本对齐：左对齐；
垂直对齐：底部对齐；
/*边框颜色：黄色*/
}
#评论框：焦点{
轮廓样式：实心；
轮廓颜色：橙色；
轮廓宽度：0px；
}
[contenteditable=true]：空：在{
内容：attr（占位符）；
颜色：#aaa；
显示：block；用于Firefox
}