可以设置inline元素的padding和margin吗？

最新推荐文章于 2024-07-26 11:37:03 发布
最新推荐文章于 2024-07-26 11:37:03 发布
阅读量4k 收藏 4
点赞数 5
分类专栏： Css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_21901233/article/details/79465048
版权

对于这个问题，我的第一感觉就是不能，后来查看资料才知道原来我把inline元素设置了width和height无效和题目搞混了，经过查资料和实际验证后，得出以下结论：

    1. inline元素设置width，height属性无效

    2.inline元素的padding和margin可以设置，但是水平方向的padding-right，padding-left，margin-right，margin-left都产生了效果，而垂直方向的padding-top，padding-bottom，margin-bottom，margin-top是没有效果的


郭从墨
关注
专栏目录
inline元素与inline-block元素的margin与padding测试
陈迹·清欢的博客
04-06 627
目录测试paddinginline元素padding测试部分inline-block元素的padding测试部分测试margininline元素的margin测试inline-block元素的margin测试总结 测试padding inline元素padding测试部分 先上代码(注意以下所有代码只要为特殊声明，均给 * 的css选择器添加了margin:0与padding:0)： <sp...
内联元素的padding和margin
weixin_45270885的博客
04-27 897
内联元素的padding和margin能设置上吗？ ​ 这是我前段时间面试某中厂被问到的一道面试题，一开始有点懵，但照自己的理解是这样回答的：内联元素不能通过改变宽高来改变元素大小，只能通过内部撑开，padding设置不上，margin-left和right可以设置上，margin-top和bottom设置不上。 ​ 面试结束后，我感觉自己对这一部分的理解还是存在问题，就一些论坛和官网查了相关问题，结论如下： ​ 1.内联元素的pading-left和padding-right可以设置上，paddi
inline 函数调用机制
最新发布
weixin_45355799的博客
07-26 969
inline 是 C++ 关键字，用于提示编译器将函数尽量内联（inline）。内联函数的代码会在每次调用时直接替换到调用点，而不是通过常规的函数调用机制。这可以减少函数调用的开销，尤其是在函数体较小且频繁调用的情况下。
css 给inline和inline-block元素设置margin和padding
weixin_30568591的博客
10-16 165
经过简单的测试，行内元素或者行内块元素的maring-left,margin-right,padding-left,padding-right都是可以正常表现的，下面来看一下剩下的margin-top,margin-bottom,padding-top,padding-bottom。经过测试，margin-top和margin-bottom都没有作用。而设置padding-top以后，元素边框...
内联元素之padding和margin的表现
wujf1986630的专栏
07-28 956
无标题文档 a定义dispaly:block前 我们是羊1 female我们是羊2定义了margin值women 我们是羊3定义了padding值women 我们是羊4定义了宽高women
inline元素的margin与padding
weixin_30388677的博客
03-12 146
替换元素与非替换元素 替换元素(replaced element)：所谓替换元素就是浏览器根据元素的标签和属性，来决定元素具体显示什么内容。比如说：img标签的src属性的值用来读取图片信息并且显示出来。又比如说，input标签的type属性决定是显示输入框还是单选按钮。html中的img、input、textarea、object、video、embed都是替换元素。 非替换元素(non-rep...
你真的了解margin吗？你知道margin有什么特性吗？
01-19
什么时候该用padding而不是margin？你知道负margin吗？你知道负margin在实际工作中的用途吗？常见的浏览器下margin出现的bug有哪些？…… Margin是什么 CSS 边距属性定义元素周围的空间。通过使用单独的属性，可以...
css行内元素padding,margin,width,height没有变化
09-25
例如，将元素设置为float: left，这会使其脱离正常的文档流，并且表现为块级元素，从而使得可以应用上下padding和margin。 float: left; width: 200px; height: 200px; padding: 20px; margin: 20px; 需要注意的是...
设置margin和padding为0可去掉DIV与DIV的空白
09-25
为了去除这些空白，最直接的方法是将相邻元素的margin和padding属性设置为0。这样做可以直接消除因为默认样式导致的空白间隙。 例如，如果你有两个相邻的元素，它们在HTML代码中是这样的： ```html 内容一 ...
对行内元素设置padding和margin不起作用
weixin_44645309的博客
12-29 1261
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录前言一、对行内元素设置padding和margin二、使用步骤1.引入库2.读入数据总结 前言 看了表严肃表哥的电商网站项目，自己动手亲自实现了一遍，前前后后遇到了几个问题，特此总结一下。 一、对行内元素设置padding和margin 代码： <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="
display：inline margin padding是否起作用
忘尘_追忆的专栏
02-05 3036
行内非替换元素span, display的方式为inline（默认） *{padding:0px;margin:0px;} p{background:gray;position:relative;left:100px;top:100px;} p span{} 12312312 显示如下： 对p设置padding：padding：10px  ,上下左右都有效果
margin-inline, margin-block，这是啥 CSS 属性？
YopenLang的博客
05-21 3235
当你一开始看到margin-inline时，是不是有种似曾相似的感觉，毕竟你学过margin和display: inline，却还从来没有见过两个的结合物。 其实还有margin-block，这种后缀是*-inline或者*-block的属性称之为逻辑属性（logical properties）。 逻辑属性其实很简单，没啥深奥的魔法，我们来通过一个例子看一下。 首先介绍一个writting-mode属性，它控制文字的方向，举个🌰： 在这个Box中，我们放了一行再也常见不过的文字，writting-m
ul左边padding-inline-start: 40px；多出宽度和高度
热门推荐
weixin_42220130的博客
05-20 1万+
默认的除IE，ul都会自动向右浮动40px
关于inline/inline-block级别元素的margin属性以及padding属性的一些理解
FuChenRenShen的博客
11-10 2555
总的来说，margin和padding属性作为新手入门时常用的属性，很多人都不陌生，相信理解起来都很简单，margin代表外边距，padding代表内边距，至少当时我们老师是这样讲的。 虽然使用起来很简单，但是真正将其实用的又能有多少人，以padding为例，作为一个内边距，就我而言，我会在使用  背景  以及  box-sizing  的时候使用的多，padding-box所占据的无非就是一点...
inline行内元素与padding margin 的断舍离
JiM-W 的博客
12-14 2792
inline 行内元素 padding margin -top bottom line-height
css 之 padding
小白向前冲！
02-02 2333
【1】padding 与 元素的尺寸   ——对块级元素    （1） 当width 为非 auto 时，padding 会影响元素尺寸    （2） 当width 为 auto 或box-sizing 为 border-box 时,padding 不会影响元素尺寸 ——对内联元素   （1） 水平 padding 影响尺寸，垂直 padding 不影响尺寸，但会影响背景占
html文字用竖线隔开,inline+padding技巧：间隔符(分割线)与文字高度不一致，间隔竖线高度缩短方法...
weixin_42164685的博客
06-04 2346
如图所示，在前端经常需要用到各种间隔符号，用CSS实现应该是最佳办法，当然如果你用图片、用符号都可以实现，但应用起来不如CSS来的那么顺，那么爽！今天就用CSS来制作这个间隔符，并且让间隔符号垂直居中，并且高度低于前后文字，这样显得干练！*{font-size:24px;}span{padding:16px6px1px;margin-left:12px;border-left:2p...
关于CSS3中display:inline的易错点
qq_21007229的博客
12-14 1058
我们都知道当display:inline时， inline元素不会独占一行，多个相邻的行内元素会排列在同一行里，直到一行排列不下，才会新换一行，其宽度随元素的内容而变化。 inline元素设置width,height属性无效。 但是对于margin,padding却有一些模糊，我看到过很多人写的博客，大多都是写的: margin-top,margin-bottom设置无效，margin-left,...
1.rgba() 和 opacity的透明效果有什么不同？ 2.行内元素和块级元素的区别是什么？行内元素的pdding和margin可以设置吗？ 3.display的属性值有哪些？分别有什么作用？
05-31
行内元素的 padding 和 margin 可以设置，但是只会在水平方向上起作用。 3. display 的属性值包括 block、inline、inline-block、flex、grid 等。block 表示将元素以块级元素的形式呈现，独占一行；inline 表示将...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值