900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > html+css面试题 行内元素padding和margin

html+css面试题 行内元素padding和margin

时间:2020-09-24 10:21:44

相关推荐

html+css面试题 行内元素padding和margin

看到一个面试题 关于行内元素span的

<style>* {padding: 0;margin: 0;}span {padding: 100px;border: 1px solid red;}</style><body><span>1</span><span>2</span></body>

我当时就笑了还有这种题? 送分的?

我想的结果:

实际结果:

我擦! 啪啪啪打脸!

为什么padding-top被无视了?

提出这个疑问后我又被打脸了!

<style>* {padding: 0;margin: 0;}span {padding: 100px;border: 1px solid red;}div{border: 1px solid red;}</style><body><span>1</span><span>2</span><div>3</div></body>

其实span是不支持padding-top、padding-bottom,不过奇怪的是既然padding不支持那为什么边框显示是有padding-bottom呢?

查了好多文章 结果只得到了一句话 行内不可替换元素padding会对边框产生影响!

我擦不可替换元素老子干了不到十年前端没听过啊?

是的官方英文文档和高程上都有说过

span、a属于不可替换元素

input属于可替换元素

padding、margin针对不可替换元素 padding-top、padding-bottom和margin-top、margin-bottom无效。。。无效。。。

哈哈 总结一下多读书是有用的!

您的点赞是我继续下去的动力,谢谢!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。