zoukankan      html  css  js  c++  java
  • 静态网页

    写网页首先要思路清晰,观察ui给定图片,预先了解实现效果和功能对应板块划分,再进行详细的功能实现细节。

    页面分抬头(header),搜索(nav),横幅(banner),容积箱(container),脚本(foot)

    1.header:开篇一般先以搜索和链接开头,建立边框和背景图块,一般以ul>li标签实现,链接则套用a标签实现,注意调整位置和美观度。

    <!DOCTYPE html>
    <html>
    <head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="../css/reset.css"/>
    <link rel="stylesheet" href="../css/four4.work.css"/>
    </head>
    <header>
    <nav>
    <ul>
    <li><a href=""><img src="../img/logo.jpg" alt="漫威"/></a></li>
    <li><a href="">首页</a></li>
    <li><a href="">最新动态</a></li>
    <li><a href=""></a>漫威</li>
         </ul>
    </nav>
    </header>

    2.搜索(nav):搜索也是ul>li标签配合a链接实现
    <div class="box1"><a href="#"><img src="../img/160216172223655101.jpg" alt="dianji"/></a></div>

     3.banner:一般以图片格式出现,为本文的横幅,简洁明了直奔主题,一般此区域为各种图片跳转翻页,实现多内容并存,现阶段只能实现图片的链接和背景渐变色或变大变小,

    也可插入视频和音频播放器,使版面看起来更活泼和新颖

    4.container:文本中心主题体现,一般为多个板块的合集,图片套文字

    5.foot:页面尾端,一般为网页的单位,制作单位,联系方式,注册信息,以及各种链接

  • 相关阅读:
    【解决火车轮播图小圆点跳的问题】传统轮播图-三位法
    jq龙禧轮播图
    QT MSVC环境中添加QWT
    XDMA ip core的使用
    PCIe基础知识与例程分析----PIO_demo
    Day04 (四)_TCP文件传输设计
    Day04 (三)_UDP传输端设计
    Day04 (二)_TCP传输客户器端设计
    Day04 (一)_TCP传输服务器端设计
    Day03 (下)_Qt文件系统
  • 原文地址:https://www.cnblogs.com/asassa/p/7668682.html
Copyright © 2011-2022 走看看