首页 > Web开发 > 详细

HTML之前端操作div标签布局

时间:2017-12-04 12:31:01      阅读:248      评论:0      收藏:0      [点我收藏+]

事例图片:

 

技术分享图片

 

div元素是用于分组HTML元素的块级元素

技术分享图片

 

上图代码示例如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div class="container" style="width: 500px">
    <div id="header" style="background-color: aqua">
        <h2 style="margin-bottom: 0;">王浩</h2>
    </div>

    <div class="menu" style="background-color: cornflowerblue;height: 200px;width: 100px;float:left">
        <b>菜单</b><br>
        <p>HTML</p>
        <P>CSS</P>
        <P>Javascript</P>
    </div>

    <div class="content" style="background-color: yellow;height: 200px;width: 400px;float: left">
        内容部分
    </div>

    <div class="footer" style="background-color: cadetblue;clear: both;text-align: center">
        版权@wanghaohao.com
    </div>
    
</div>

</body>
</html>

 

HTML之前端操作div标签布局

原文:http://www.cnblogs.com/wanghaohao/p/7976324.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!