Repository navigation
Expand file tree
/
Copy pathindex.html
More file actions
105 lines (101 loc) · 5.98 KB
/
Copy pathindex.html
File metadata and controls
105 lines (101 loc) · 5.98 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>鏃犳爣棰樻枃妗�</title>
<style type="text/css">
<!--
@import url("style.css");
-->
</style>
<style type="text/css">
<!--
body {
font: 100% 瀹嬩綋, 鏂板畫浣�;
background: #666666;
margin: 0; /* 鏈€濂藉皢 body 鍏冪礌鐨勮竟璺濆拰濉厖璁剧疆涓� 0 浠ヨ鐩栦笉鍚岀殑娴忚鍣ㄩ粯璁ゅ€� */
padding: 0;
text-align: center; /* 鍦� IE 5* 娴忚鍣ㄤ腑锛岃繖浼氬皢瀹瑰櫒灞呬腑銆傛枃鏈殢鍚庡皢鍦� #container 閫夋嫨鍣ㄤ腑璁剧疆涓洪粯璁ゅ乏瀵归綈 */
color: #000000;
}
.thrColAbs #container {
position: relative; /* 娣诲姞鈥減osition: relative鈥濆厑璁告偍灏嗕袱涓晶鏍忕浉瀵逛簬姝ゅ鍣ㄦ斁缃� */
width: 780px; /* 浣跨敤姣旀渶澶у搴� (800px) 灏� 20px 鐨勫搴﹀彲鏄剧ず娴忚鍣ㄧ晫闈㈠厓绱狅紝骞堕伩鍏嶅嚭鐜版按骞虫粴鍔ㄦ潯 */
background: #FFFFFF;
margin: 0 auto; /* 鑷姩杈硅窛锛堜笌瀹藉害涓€璧凤級浼氬皢椤甸潰灞呬腑 */
border: 1px solid #000000;
text-align: left; /* 杩欏皢瑕嗙洊 body 鍏冪礌涓婄殑鈥渢ext-align: center鈥濄€� */
}
/* 缁濆瀹氫綅渚ф爮鐨勬彁绀猴細
1. 蹇呴』涓虹粷瀵瑰畾浣� (AP) 鍏冪礌鎸囧畾椤堕儴杈硅窛鍜屼晶杈硅窛锛堝乏杈硅窛鎴栧彸杈硅窛锛夈€傞粯璁ゆ儏鍐典笅锛屽鏋滄湭鎸囧畾椤堕儴杈硅窛锛屽垯 AP 鍏冪礌灏嗙揣璺熼〉闈㈡簮浠ｇ爜涓殑鍓嶄竴涓厓绱犱箣鍚庡嚭鐜般€傝繖鎰忓懗鐫€锛屽鏋滃湪鏂囨。鐨勬簮浠ｇ爜椤哄簭涓紝渚ф爮鏄� #container 涓殑绗竴涓厓绱狅紝閭ｄ箞锛屽嵆浣挎湭鎻愪緵椤堕儴杈硅窛鍊硷紝渚ф爮涔熷皢鍑虹幇鍦� #container 鐨勯《绔€備絾鏄紝濡傛灉瀹冧滑鐨勬簮浠ｇ爜椤哄簭涔嬪悗鐢变簬浠讳綍鍘熷洜鑰岀Щ鍔紝灏遍渶瑕佸叿鏈夐《閮ㄨ竟璺濆€硷紝鎵嶈兘鏄剧ず鍦ㄦ墍闇€鐨勪綅缃€�
2. 缁濆瀹氫綅 (AP) 鍏冪礌宸蹭粠鏂囨。娴佷腑鍘婚櫎銆傝繖鎰忓懗鐫€缁濆瀹氫綅鍏冪礌鍛ㄥ洿鐨勫厓绱犱笉鐭ラ亾瀹冧滑鏄惁瀛樺湪锛屽湪鍗犳嵁鍚堢悊鐨勯〉闈㈢┖闂存椂涓嶄細鑰冭檻瀹冧滑銆傚洜姝わ紝濡傛灉鎮ㄧ‘淇″ぇ閮ㄥ垎鍐呭灏嗘€绘槸鍖呭惈鍦ㄤ腑闂寸殑 #mainContent div 涓紝鍒欏彧搴斿綋灏� AP div 鐢ㄤ綔渚ф爮銆傚鏋滀换涓€渚ф爮涓皢鍖呭惈鏇村鐨勫唴瀹癸紝鍒欒渚ф爮灏嗚秴鍑虹埗 div 鐨勫簳閮紝姝ゆ椂渚ф爮浼氱湅璧锋潵娌℃湁琚畬鍏ㄥ寘鍚繘鏉ャ€�
3. 濡傛灉婊¤冻浜嗕笂杩拌姹傦紝鍒欏彲浠ヤ娇鐢ㄧ粷瀵瑰畾浣嶄晶鏍忔潵鏂逛究鍦版帶鍒舵枃妗ｇ殑婧愪唬鐮侀『搴忋€�
*/
.thrColAbs #sidebar1 {
position: absolute;
top: 0;
left: 0;
width: 150px; /* 鍦ㄧ鍚堟爣鍑嗙殑娴忚鍣ㄤ腑鎴栬€呭湪 Internet Explorer 涓殑鏍囧噯妯″紡涓嬶紝姝� div 鐨勫疄闄呭搴﹂櫎浜嗗寘鎷搴﹀锛岃繕鍖呮嫭濉厖鍜岃竟妗� */
background: #EBEBEB; /* 灏嗘樉绀鸿儗鏅壊锛屽叾瀹藉害绛変簬鏍忎腑鍐呭鐨勯暱搴︼紝*/
padding: 15px 10px 15px 20px; /* 濉厖浣� div 鐨勫唴瀹逛笌杈圭紭淇濇寔涓€瀹氱殑璺濈 */
}
.thrColAbs #sidebar2 {
position: absolute;
top: 0;
right: 0;
width: 160px; /* 鍦ㄧ鍚堟爣鍑嗙殑娴忚鍣ㄤ腑鎴栬€呭湪 Internet Explorer 涓殑鏍囧噯妯″紡涓嬶紝姝� div 鐨勫疄闄呭搴﹂櫎浜嗗寘鎷搴﹀锛岃繕鍖呮嫭濉厖鍜岃竟妗� */
background: #EBEBEB; /* 灏嗘樉绀鸿儗鏅壊锛屽叾瀹藉害绛変簬鏍忎腑鍐呭鐨勯暱搴︼紝*/
padding: 15px 10px 15px 20px; /* 濉厖浣� div 鐨勫唴瀹逛笌杈圭紭淇濇寔涓€瀹氱殑璺濈 */
}
.thrColAbs #mainContent {
margin: 0 200px; /* 姝� div 鍏冪礌鐨勫乏杈硅窛鍜屽彸杈硅窛浼氬湪椤甸潰涓や晶涓婂垱寤轰袱涓閮ㄦ爮銆傛棤璁轰晶鏍� div 涓寘鍚灏戝唴瀹癸紝鏍忓唴鐨勭┖闂撮兘灏嗕繚鐣欍€� */
padding: 0 10px; /* 璇疯浣忥紝濉厖鏄� div 鏂瑰潡鍐呴儴鐨勭┖闂达紝杈硅窛鍒欐槸 div 鏂瑰潡澶栭儴鐨勭┖闂� */
}
.fltrt { /* 姝ょ被鍙敤鏉ヤ娇椤甸潰涓殑鍏冪礌鍚戝彸娴姩銆傛诞鍔ㄥ厓绱犲繀椤讳綅浜庨〉闈笂瑕佷笌涔嬬浉閭荤殑鍏冪礌涔嬪墠銆� */
float: right;
margin-left: 8px;
}
.fltlft { /* 姝ょ被鍙敤鏉ヤ娇椤甸潰涓婄殑鍏冪礌鍚戝乏娴姩 */
float: left;
margin-right: 8px;
}
-->
</style><!--[if IE 5]>
<style type="text/css">
/* 灏� IE 5* 鐨� css 鏂瑰潡妯″瀷淇鏀惧湪杩欎釜鏉′欢娉ㄩ噴涓� */
.thrColAbs #sidebar1 { width: 180px; }
.thrColAbs #sidebar2 { width: 190px; }
</style>
<![endif]--></head>
<body class="thrColAbs">
<div id="container">
<div id="mainContent">
<h1> 涓昏鍐呭 </h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. </p>
<h2>H2 绾у埆鐨勬爣棰� </h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio.</p>
<!-- end #mainContent --></div>
<div id="sidebar1">
<h3>Sidebar1 </h3>
<p>姝� div 涓婃墍鏄剧ず鐨勮儗鏅壊鍒氬ソ涓庡唴瀹圭瓑瀹姐€傚鏋滄偍鍠滄鏀圭敤鍒嗙晫绾匡紝鑰屼笖 #mainContent div 灏嗗缁堝寘鍚緝澶氱殑鍐呭锛岃鍦� #mainContent div 鐨勫乏杈圭紭鏀剧疆涓€涓竟妗嗐€� </p>
<p>Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. </p>
<!-- end #sidebar1 --></div>
<div id="sidebar2">
<h3>Sidebar2 </h3>
<p>姝� div 涓婃墍鏄剧ず鐨勮儗鏅壊鍒氬ソ涓庡唴瀹圭瓑瀹姐€傚鏋滄偍鍠滄鏀圭敤鍒嗙晫绾匡紝鑰屼笖 #mainContent div 灏嗗缁堝寘鍚緝澶氱殑鍐呭锛岃鍦� #mainContent div 鐨勫彸杈圭紭鏀剧疆涓€涓竟妗嗐€� </p>
<p>Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. </p>
<!-- end #sidebar2 --></div>
<!-- end #container --></div>
</body>
</html>
<p>
这里是 首页
</p>
<blockquote>
嗨！大家好，这是用Vimwiki编写的主页。
</blockquote>
</div>
<div id="footer">
Powered by <a href="http://vimwiki.googlecode.com/">Vimwiki</a>,
%time_stamp%.
</div>
</body>
</html>