爱法斗学编程 2019-10-13 17:40 采纳率: 72.7%
浏览 1286
已采纳

css设置中增加border属性设置,div区域的内容无法居中。求助,求助。

问题是这样的
1我本来想用类选择器lne加一个水平分割线,加了显示在上面,且我设置了padding为0,还是有段距离。
2我索性就将div的区域的宽和高直接设置了,如下面展示。都没什么问题,问题就在于我加了border属性后,文本内容不在div之中了,删除border就又好了。我不知道是因为什么,难道border上下还占据大小的。
希望懂的人给详细解答下。

![图片说明](https://img-ask.csdn.net/upload/201910/13/1570959934_388628.png)


.lne{

width: 600px;
height: 32px;
line-height: 32px;
margin: 40px;
padding:0px;
background-color: #999;
 border-top:2px dashed red;

}
实际效果:
图片说明

  • 写回答

1条回答 默认 最新

  • 天际的海浪 2019-10-13 18:23
    关注

    因为p元素的上下margin有一定的默认值,并且相邻元素和父子元素的上下margin会有合并特性。
    具体请看:https://www.w3school.com.cn/css/css_margin_collapsing.asp
    也就是说,父子元素之间没有内边距或边框把外边距分隔开,它们的上或下外边距会发生合并。
    这样p元素的上下margin就合并到.lne的margin: 40px;中,而不可见了,
    当你设置.lne的border就把父子元素间的外边距分隔开了。p元素的上下margin就单独呈现出来了。

    你把p 的margin 设置为 0px 即可

    .lne p{
        margin: 0px;
    }
    
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题