一个简单的网页系统(一)
最近心血来潮写了一个网页系统,用来分享自己游玩的地方。主要使用到了leaflet.js d3.js myfocus.js jquery等JS 库。
一. 效果展示
二. 结构分析
(1)导航栏 : logo可以在线免费自定义制作。导航栏无非是<ul></ul> 里面包含几个<li>标签,标签里面套一个超链接。
并设置ul list-style:none; 以及链接a text-decoration:none; float:left; 以及a 的四种状态。
(2)图片栏 :使用了myFocus 的JS库,比较简单。类似于BootStrap,为<div>添加相应的类名即可。
(3)展示栏:分为左中右,结构相似。灵活使用float属性。此处使用动态分配每部分宽度。
三. 代码分析
代码格式看起来比较乱,尤其是style部分没有对齐(在代码中对齐可能显示在博客中有 <span>标签)。不过能通过格式化软件格式化
<!DOCTYPE html>
<html>
<head>
<title>Index Page</title>
<meta charset="utf-8">
<style type="text/css">
*{
margin: 0;
padding: 0;
}
body,html{
width: 100%;
font-family: '微软雅黑';
}
.menu{