span标签对于margin-top,margin-bottom无效,但是margin-left,margin-right却是有效的。
2024-09-27 14:47:18
首先,span是行内元素,是没有宽高的。
我们来做个简单的布局
<div>
<span>内容内容内容内容内容内容内容内容</span>
</div>
页面的最原始的效果,就给div加个边框:
为了能够让span的margin-top和margin-bottom生效,可以按照下面的做法:给span加一个display:inline-block或者直接display:block;具体操作,随你自己。
还有一个就是,你想让文字居中,就可以借助line-height,这个时候,就可以不需要display来控制了,你要多高,就改变line-height的值就可以,也不需要margin-top或者margin-bottom,因为你加了line-height本来文字居中了,然后你加个外边距,反倒让文字偏移了预期,这就多此一举了。
需要说明的就是,span的margin-left和margin-right是本来就有效的,跟display属性没有关系。
最新文章
- WinForm GDI+ 资料收集
- JavaScript学习笔记3之 数组 &; arguments(参数对象)&; 数字和字符串转换 &; innerText/innerHTML &; 鼠标事件
- 李洪强iOS经典面试题123
- 42.旋转数组的最小元素[Get min value of rotated array]
- HDU 1520:Anniversary party(树形DP)
- c#对文件进行MD5加密校验
- preference activity框架
- spring cron 定时任务
- ASP.NET Core入门
- Jury Meeting CodeForces - 854D (前缀和维护)
- 用stringstream可以用来分割空格、tab、回车换行隔开的字符串:
- 选择结构if
- jmeter二次开发----Loadrunner或Jmeter发送邮件报告
- VSTO:使用C#开发Excel、Word【9】
- Jmeter --- 分布式测试
- ubuntu linux下建立stm32开发环境: GCC安装以及工程Makefile建立
- 3-9《元编程》第3章Tuesday:methods
- python多态和鸭子类型
- Cocos2d-x游戏导出android工程,提取cocos的so文件
- 【BZOJ 1098】办公楼(补图连通块个数,Bfs)
热门文章
- c/c++排坑(4) -- c/c++中返回局部变量
- ubuntu18.04安装chrome浏览器
- 一个电商项目的Web服务化改造2:现有项目的5个问题
- hdu2015 偶数求和【C++】
- GeoTrust 企业(OV)型 增强版(EV) 多域名(SAN/UC) SSL证书
- Maven学习总结(1)——Maven入门
- [bzoj2802][Poi2012]Warehouse Store_贪心_堆
- 洛谷 P2965 [USACO09NOV]农活比赛The Grand Farm-off
- sql server使用杂记
- 重学C++ (十一) OOP面向对象编程(2)