如何将div和p重合?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <style type="text/css">
        #d1{border:1px solid black;height:30px;font-size:0px;
        }
        p{border:1px solid red;height:30px;}
    </style>  
</head>
<body>
    <div id="d1">
    <p>xx</p>
    </div>
</body>
</html>

div和p重合了,但是p里面的文字没有显现出来。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <style type="text/css">
        #d1{border:1px solid black;height:30px;font-size:0px;
        }
        p{border:1px solid red;height:30px;font-size:16px;}
    </style>  
</head>
<body>
    <div id="d1">
    <p>xx</p>
    </div>
</body>
</html>

文字显现出来了,但是div p 不重合。

图片描述

我如何做到:

1.div 和p的border完全一致。

2.p的文字正常显示?

阅读 2.9k
3 个回答

最简单的做法:

*{
    margin: 0;
    padding: 0;
}
#d1 { border: 1px solid black; }
p { border: 1px solid red; }

p表示段落标签 他有自带的属性!

p标签有默认的margin值。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题