看过《教我写net通用权限框架1之菜单导航篇》之后发生的事.docx
《看过《教我写net通用权限框架1之菜单导航篇》之后发生的事.docx》由会员分享,可在线阅读,更多相关《看过《教我写net通用权限框架1之菜单导航篇》之后发生的事.docx(39页珍藏版)》请在冰豆网上搜索。
看过《教我写net通用权限框架1之菜单导航篇》之后发生的事
看过《教我写.net通用权限框架
(1)之菜单导航篇》之后发生的事
引言
本来是想继续UML学习系列的,今天换换内容,一直弄那个也挺无聊的,在博客园看到这位牛人怎么扣界面的,觉得很新奇,今天也尝试了。
确实很牛逼。
这里也将学习结果分享一下。
十分感谢@微软高级php工程师,膜拜啊。
原文地址:
大湿教我写.net通用权限框架
(1)之菜单导航篇
他的文章下面有三个链接,这里就做个简单的,怎么扣登录界面?
患者:
登录界面
手术台:
火狐浏览器
主刀人:
LZ
操刀过程
解剖
1)首先根据他给的链接进入登录界面http:
//223.86.105.239:
803/Frame/Login.htm
这界面还第一次见到,不让我右键,不让我F12(IE浏览器F12有效,其他浏览器F12没反应......),那只能
2)查看源代码
取内脏
样式怎么扣下来?
单击进去,比如desktop.css这个样式文件。
1/*桌面版导航菜单*/
2*{padding:
0px;margin:
0px;font-size:
9pt;}
3html{
4height:
100%;
5overflow:
hidden;
6}
7body
8{
9margin:
0px;
10padding:
0px;
11font-family:
微软雅黑,宋体,Arial,Helvetica,Verdana,sans-serif;
12color:
#000000;
13overflow:
hidden;
14/*background-image:
url("../images/wallpaper/003.jpg")*/
15background:
url('../Images/bg.jpg')repeatleftbottomtransparent;
16}
17#loading
18{
19font-size:
14pt;
20position:
absolute;
21z-index:
3000;
22left:
42%;
23top:
40%;
24border:
1pxsolid#ccc;
25width:
auto;
26padding:
10px10px7px10px;
27background:
#fff;
28display:
none;
29cursor:
pointer;
30color:
#666;
31-moz-border-radius:
15px;/*Geckobrowsers*/
32-webkit-border-radius:
15px;/*Webkitbrowsers*/
33border-radius:
15px;/*W3Csyntax*/
34}
35div,ul,li,dl,dt,dd,img,h1,h2
36{
37margin:
0px;
38padding:
0px;
39list-style-type:
none;
40border:
0;
41}
42bodya
43{
44outline:
none;
45blr:
expression(this.onFocus=this.blur());
46}
47img{
48border:
0px;
49}
50a:
link
51{
52color:
#222;
53text-decoration:
none;
54}
55a:
visited
56{
57color:
#222;
58text-decoration:
none;
59}
60a:
hover
61{
62color:
#222;
63text-decoration:
none;
64}
65a:
active
66{
67color:
#222;
68text-decoration:
none;
69}
70/*主界面顶部*/
71#north{
72height:
78px;
73color:
#fff;
74overflow:
hidden;
75}
76
77#north#banner_text{
78color:
#FFFFFF;
79font-weight:
bold;
80font-size:
18pt;
81}
82
83#north#north_left{
84float:
left;
85padding-left:
10px;
86}
87#north#north_lefttable{
88border:
0px;
89height:
78px;
90}
91#north#north_lefttabletd{
92
93vertical-align:
middle;
94}
95#north#north_right{
96float:
right;
97padding-top:
8px;
98}
99
100/*一级标签*/
101#taskbar{
102height:
40px;
103overflow:
hidden;
104
105}
106
107/*一级标签左侧*/
108#taskbar#taskbar_left{
109float:
left;
110padding:
0px10px;
111}
112
113/*导航菜单*/
114#taskbar#taskbar_left#start_menu{
115display:
block;
116width:
97px;
117height:
40px;
118background:
url('../Images/start_menu.png')center0pxno-repeat;
119}
120#taskbar#taskbar_left#start_menu:
hover,
121#taskbar#taskbar_left#start_menu.active{
122background-position:
center-40px;
123}
124
125/*一级标签*/
126#taskbar#taskbar_center{
127padding-top:
10px;
128float:
left;
129}
130#taskbar#taskbar_center#tabs_left_scroll{
131float:
left;
132width:
30px;
133height:
30px;
134display:
none;
135cursor:
pointer;
136background:
url('../Images/tabs_arrow.png')no-repeat0pxcenter;
137}
138#taskbar#taskbar_center#tabs_left_scroll.active{
139background:
url('../Images/tabs_arrow.png')no-repeat-60pxcenter;
140}
141#taskbar#taskbar_center#tabs_container{
142height:
30px;
143width:
100%;
144float:
left;
145overflow:
hidden;
146white-space:
nowrap;
147}
148#taskbar#taskbar_center#tabs_containerdiv{
149cursor:
pointer;
150display:
inline-block;
151margin-right:
3px;
152padding-right:
5px;
153white-space:
nowrap;
154-moz-border-radius-topleft:
5px;
155-moz-border-radius-topright:
5px;
156-webkit-border-top-left-radius:
5px;
157-webkit-border-top-right-radius:
5px;
158}
159#taskbar#taskbar_center#tabs_containerdiv{*display:
inline!
important;}
160#taskbar#taskbar_center#tabs_containerdiva.tab{
161display:
inline-block;
162padding-left:
10px;
163padding-right:
3px;
164min-width:
64px!
important;
165width:
auto!
important;
166width:
80px;
167text-decoration:
none;
168color:
#fff;
169height:
30px;
170line-height:
30px;
171text-align:
center;
172-moz-border-radius-topleft:
5px;
173-moz-border-radius-topright:
5px;
174-webkit-border-top-left-radius:
5px;
175-webkit-border-top-right-radius:
5px;
176}
177#taskbar#taskbar_center#tabs_containerdiv.selected{
178background:
url('../Images/tabs_active.png')no-repeatright-30px;
179}
180#taskbar#taskbar_center#tabs_containerdiv.selecteda.tab{
181color:
#416AA3;
182font-size:
14px;
183font-weight:
bold;
184background:
url('../Images/tabs_active.png')no-repeatleft0px;
185}
186#taskbar#taskbar_center#tabs_containerdiva.close{
187display:
none;
188width:
16px;
189height:
16px;
190margin-bottom:
-2px!
important;
191margin-bottom:
2px;
192background:
url('../Images/tabs_close.png')0pxcenterno-repeat;
193z-index:
1;
194}
195#taskbar#taskbar_center#tabs_containerdiva:
hover.close{
196cursor:
pointer;
197background-position:
-16pxcenter;
198}
199#taskbar#taskbar_center#tabs_containerdiv.selecteda.close{
200display:
inline-block;
201}
202
203#taskbar#taskbar_center#tabs_right_scroll{
204float:
right;
205width:
30px;
206height:
30px;
207display:
none;
208cursor:
pointer;
209background:
url('../Images/tabs_arrow.png')no-repeat-30pxcenter;
210}
211#taskbar#taskbar_center#tabs_right_scroll.active{
212background:
url('../Images/tabs_arrow.png')no-repeat-90pxcenter;
213}
214
215/*一级标签右侧*/
216#taskbar#taskbar_right{
217float:
right;
218padding-left:
10px;
219}
220/*任务中心*/
221#taskbar#taskbar_right#task_center{
222display:
inline-block;
223width:
30px;
224height:
25px;
225margin-top:
10px;
226margin-right:
5px;
227background:
url('../Images/desktop_icons.png')0px0pxno-repeat;
228}
229#taskbar#taskbar_right#task_center:
hover,
230#taskbar#taskbar_right#task_center.active{
231background-position:
0px-25px;
232}
233/*事务提醒*/
234#taskbar#taskbar_right#portal{
235display:
inline-block;
236width:
30px;
237height:
25px;
238margin-top:
10px;
239margin-right:
5px;
240background:
url('../Images/desktop_icons.png')-323px0pxno-repeat;
241}
242#taskbar#taskbar_right#portal:
hover,
243#taskbar#taskbar_right#portal.active{
244background-position:
-323px-25px;
245}
246/*注销登录*/
247#taskbar#taskbar_right#logout{
248display:
inline-block;
249width:
30px;
250height:
25px;
251margin-top:
10px;
252margin-right:
5px;
253background:
url('../Images/desktop_icons.png')-288px0pxno-repeat;
254}
255#taskbar#taskbar_right#logout:
hover,
256#taskbar#taskbar_right#logout.active{
257background-position:
-288px-25px;
258}
259
260/*更换皮肤*/
261#taskbar#taskbar_right#theme{
262display:
inline-block;
263width:
30px;
264height:
25px;
265margin-top:
10px;
266margin-right:
5px;
267background:
url('../Images/desktop_icons.png')-364px0pxno-repeat;
268}
269#taskbar#taskbar_right#theme:
hover,
270#taskbar#taskbar_right#theme.active{
271background-position:
-364px-25px;
272}
273
274
275
276/*隐藏顶部区域*/
277#taskbar#taskbar_right#hide_topbar{
278display:
inline-block;
279width:
30px;
280height:
25px;
281margin-top:
10px;
282margin-right:
5px;
283background:
url('../Images/show_topbar.png')0px0pxno-repeat;
284}
285#taskbar#taskbar_right#hide_topbar:
hover,
286#taskbar#taskbar_right#hide_topbar.active{
287background-position:
-0px-25px;
288}
289
290
291/*二级标签及搜索栏*/
292#funcbar{
293height:
4px;
294background:
#e5e5e5;
295overflow:
hidden;
296}
297/*二级标签左侧*/
298#funcbar#funcbar_left{
299position:
relative;
300}
301#funcbar#funcbar_left.second-tabs-container{
302position:
absolute;
303left:
0px;
304top:
0px;
305}
306
307#funcbar#funcbar_lefta{
308float:
left;
309display:
block;
310height:
30px;
311line-height:
30px;
312padding-left:
15px;
313margin-left:
3px;
314color:
#383838;
315text-decoration:
none;
316background:
url('../Images/second_tabs_inactive.png')rightcenterno-repeat;
317}
318#funcbar#funcbar_leftaspan{
319height:
30px;
320line-height:
30px;
321padding-right:
15px;
322cursor:
pointer;
323}
324#funcbar#funcbar_lefta.last{
325background:
none;
326}
327#funcbar#funcbar_lefta:
hover,
328#funcbar#funcbar_lefta.active{
329color:
#fff;
330background:
url('../Images/second_tabs_active.png')leftcenterrepeat-x;
331}
332
333/*二级标签右侧*/
334#funcbar#funcbar_right{
335float:
right;
336padding:
0px10px;
337}
338#funcbar#funcbar_right.search{
339float:
left;
340display:
inline-block!
important;
341display:
inline;
342padding-left:
26px;
343width:
134px!
important;
344width:
167px;
345height:
30px;
346background:
url('../Images/search_bg.png')left0pxno-repeat;
347}
348#funcbar#funcbar_right.search.search-body{
349padding-right:
26px;
350background:
transparenturl('../Images/search_bg.png')right-60pxno-repeat;
351position:
relative;
352}
353#funcbar#funcbar_right.search.search-body.search-input{
354height:
30px;
355background:
transparenturl('../Images/search_bg.png')left-30pxrepeat-x;
356}
357#funcbar#funcbar_right.search.search-body.search-inputinput{
358width:
100%;
359height:
16px;
360margin-top:
7px;
361border:
0px;
362background:
transparent;
363padding-left:
0p