javascript - 給js寫的盒子添加css樣式，css樣式沒起作用。
問題描述
js中寫了些盒子，在css中給它添加些樣式。但是沒起到作用。代碼;<!DOCTYPE html><html lang='en'><head>
<meta charset='UTF-8'><title>Title</title><style> *{margin: 0;padding:0;} .box{width:500px;height:800px;position: relative;display: block;overflow: hidden;} img{width: 500px;height:900px;} #cover{position: absolute;height:800px;width:505px;top:0;left:0;display:block;background: transparent;} p{display: inline;height:50px;width:50px;border:1px solid #eee;background: #eee;margin: 0;}</style><script> window.onload=function () {var cover=document.getElementById('cover');str='';op=document.getElementsByTagName('p');for(var i=0;i<200;i++){ str+='<p></p>'}cover.innerHTML=str;for(vari=0;i<199;i++){ op[i].onmouseover=function () {this.style.background='transparent'; }} }</script>
</head><body><section id='box'>
<img src='http://www.aoyou183.cn/wenda/images/zhuyin.jpg'><section id='cover'></section>
</section></body></html>
如圖添加的盒子p，在<style><style>寫了沒效果
問題解答
回答1：原因在于：display: inline;
inline的含義就是，把元素當成行內元素，比如span標簽，這樣的元素是不可以設置寬高的，因為設置了也不會生效。我猜你是想設置成inline-block的。
網公網安備