HTML CSS 百分比DIV边框消重 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        body {
            font: 12px Tahoma;
            margin: 0px;
            text-align: center;
            background: #FFF;
        }

        #container {
            width: 100%;
        }

        #Header {
            width: 100%;
            margin: 0 auto;
            height: 100px;
            border-style: solid;
            border-width: 1px;
        }

    </style>
</head>
<body>
<div id="container">
    <div id="Header">页面头部100%宽度</div>
</div>
<div style=" float:left; width:25%; height:100px; text-align:center; border:solid black; border-width:1px 0px 1px 1px; margin-right:-1px;margin-top: -1px;
">页面主体左侧25%宽度
</div>
<div style=" float:left; width:50%; height:100px; text-align:center;border:solid black; border-width:1px 0px 1px 1px; margin-right:-1px;margin-top: -1px;
">页面主体中部50%宽度
</div>
<div style=" float:left; width:25%; height:100px; text-align:center;border:solid black; border-width:1px 0px 1px 1px;  margin-right:-1px;margin-top: -1px;
">页面主体右侧25%宽度
</div>
</body>
</html>

 

posted @ 2021-09-16 15:22  Sakimir  阅读(10)  评论(0)    收藏  举报