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:页面尾端,一般为网页的单位,制作单位,联系方式,注册信息,以及各种链接

  • 相关阅读:
    123
    p1216
    离线可持久化动态树
    线段树合并
    p2024
    树的dfs序,p1539,p1651,,2018/11/08模拟赛T3
    p1460
    CDQ分治,二维数点与三维数点,p1357与p2026与p2027与p2028与p2029
    自动AC机
    平衡二叉树之splay p1998
  • 原文地址:https://www.cnblogs.com/asassa/p/7668682.html
Copyright © 2011-2022 走看看