• 2016年11月1日 网页布局


    今天讲了页面布局,自己做得部分练习如下:
    <style type="text/css">
    *{ margin:0px auto; padding:opx; font-family:微软雅黑
    }
    #bangzhu
    {
    80px;
    height:32px;
    font-size:12px;
    color: #a5cf4c;
    font-weight: bold;
    float:right;
    margin-right:4px;
    margin-top:40px

    }

    #a1{ 100%; height:200
    }
    #bt{ 100%;
    }
    #biaoti{float:left; margin-top:70px; margin-left:90px; font-size: 14px;
    font-weight: normal;color: #666;
    }
    #logo{ float:left;margin-top:60px; margin-left:30px
    }
    #sousuo{ margin-top:70px; border-bottom:#999; margin-left::20px
    }

    </style>

    </head>

    <body >
    <<div style="color:#868585;font-size: xx-small;position: relative;text-align: right;padding-right: 2%;padding-bottom:2px; background-color: #fff; >[广告]
    </div>

    <div style="100%">


    <div id="bangzhu">售后服务</div>


    <div id="bangzhu">帮助中心&nbsp;&nbsp;&nbsp;·</div>


    <div id="bangzhu">在线客服&nbsp;&nbsp;&nbsp;·</div>
    </div>
    <div id="bt">
    <div id="logo">
    <img src="捕获.PNG" />
    </div>
    <div style="100%">


    <div id="biaoti"> 官方商城</div>
    <div id="biaoti">全部产品</div>
    <div id="biaoti">VIVE</div>
    <div id="biaoti">官方社区</div>
    <div id="biaoti">最新活动</div>
    <div id="biaoti">购买地点</div>
    </div>

    </div>

    效果是:

  • 相关阅读:
    ubuntu LAMP的安装
    windows中安装liunx虚拟机
    jQuery Responsive OneByOne Slider Plugin
    轮播图收集
    移动端图片延迟加载插件
    图片幻灯插件
    小tip: base64:URL背景图片与web页面性能优化
    基于HTML5的可预览多图片Ajax上传
    字体平滑解决方案
    webstorm scss编译css配置
  • 原文地址:https://www.cnblogs.com/F4natasy/p/6021121.html
Copyright © 2020-2023  润新知