如何获取这个网页的代码

2023-02-21 21:30:02html-css011

如何获取这个网页的代码,第1张

<html>

<head>

<title>桂林电子科技大学-『智能交通系统研究所』 - 网站首页</title>

</head>

<body>

<!--

body{

margin:0px

font-family:Verdana

font-size: 9pt

line-height: 20px

color: #000000

background-image: url(Skins/Default/bg.gif)

background-position:center

}

tr{

font-size: 9pt

color: #000000

line-height: 20px

height:20px

}

.table1{

border: 1px solid #CCCCCC

background-color:#FFFFFF

width: 96%

}

.table2{

border: 1px solid #CCCCCC

background-color:#FFFFFF

width: 98%

}

.table3{

border: 1px solid #CCCCCC

background-color:#ECEEE4

width: 98%

}

.Atc_title{

Height: 30px

font-size:16px

font-weight:bold

text-align:center

}

.bar{

background-image:url(Skins/Default/bar.gif)

height:26px

font-weight:bold

}

.bar2{

background-color:#ECEEE4

border-color:#CCCCCC

text-align:center

}

.bar3{

background-color:#ECEEE4

border-color:#CCCCCC

height:23px

font-weight:bold

}

.top_nav{

height: 3px

background-color:#CCCCCC

}

.menu{

background-image:url(Skins/Default/menu.gif)

height:25px

text-align:center

}

.left{

background-color:#EDEDED

width:200px

vertical-align:text-top

}

.right{

background-color:#FFFFFF

vertical-align:text-top

}

.separate{

height:5px

}

.title{ font-weight:bold}

.botton {

background-image:url("Skins/Default/botton.gif")

height: 20px

width: 55px

border: none

}

td.article{

font-style: normal

font-weight: normal

font-variant: normal

text-transform: none

text-decoration: none

border-bottom-style:dashed

border-width: 0px 0px 1px

height:23px

}

input,select{height:20pxfont-size: 9ptfont-family:Verdana}

A:link,A:active,A:visited{TEXT-DECORATION:none Color:#000000}

A:hover{TEXT-DECORATION:underlineColor:#FF0000}

div.quote{margin:3px 3pxborder:1px solid #CCCCCCpadding:5pxbackground:#F3F3F3 line-height : normal }

div.HtmlCode{margin:3px 3pxborder:1px solid #CCCCCCpadding:5pxbackground:#FDFDDF

font-size:14pxfont-family:Tahomafont-style : obliqueline-height : normal font-weight:bold

}

.menuskin {

BORDER: #666666 1px solidVISIBILITY: hiddenFONT: 12px Verdana

POSITION: absoluteBACKGROUND-COLOR:#F6F6F6

background-image:url("Skins/Default/menubg.jpg")

}

.menuskin A {

PADDING-RIGHT: 10pxPADDING-LEFT: 25pxCOLOR: blackTEXT-DECORATION: nonebehavior:url(inc/noline.htc)

}

#mouseoverstyle {

BACKGROUND-COLOR: #FFFFFFmargin:2pxpadding:0pxborder:#CCCCCC 1px solid

}

#mouseoverstyle A {

COLOR: black

}

.menuitems{

margin:2pxpadding:1pxword-break:keep-all

}

-->

</style>

<tr>

</tr>

<tr>

</td>

</tr>

</table><DIV class=menuskin id=popmenu onmouseover=clearhidemenu()highlightmenu(event,'on') onmouseout=highlightmenu(event,'off')dynamichide(event) style='Z-index:100'></DIV><script Language=Javascript src='inc/pop.js'></script>

linkset[0]=new Array()

linkset[0][0]='<div class=menuitems><a href=article_list.asp?show=34>科研项目</a></div>'

linkset[0][1]='<div class=menuitems><a href=article_list.asp?show=40>科技论文</a></div>'

linkset[1]=new Array()

linkset[1][0]='<div class=menuitems><a href=downloads_list.asp?show=12>设计工具</a></div>'

linkset[1][1]='<div class=menuitems><a href=downloads_list.asp?show=13>网络工具</a></div>'

linkset[2]=new Array()

linkset[2][0]='<div class=menuitems><a href=?skin=0>恢复默认设置</a></div>'

linkset[2][1]='<div class=menuitems><a href=?skin=1>├ <font color=red>默认风格</font></a></div>'

linkset[3]=new Array()

linkset[3][0]='<div class=menuitems><a href=pic_list.asp?show=14>人物专题</a></div>'

linkset[3][1]='<div class=menuitems><a href=pic_list.asp?show=15>研发成果</a></div>'

linkset[5]=new Array()

linkset[5][0]='<div class=menuitems><a href=synopsis.asp target=_self title=智能交通系统研究所简介>简介</a></div>'

linkset[5][1]='<div class=menuitems><a href=men.asp target=_self title=智能交通系统研究所主要成员>主要成员</a></div>'

linkset[5][2]='<div class=menuitems><a href=faq.asp target=_self title=FAQ>关于站长</a></div>'

</script><table width="760" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td height="25" colspan="3" class="menu"><a href='index.asp' target='_self' title='首页'>网站首页</a>| <a href='#' target='_self' title='智能交通系统研究所介绍' onmouseover=showmenu(event,5,1,false) onmouseout=delayhidemenu()>中心介绍</a>| <a href='news_list.asp' target='_self' title='新闻中心'>最新资讯</a>| <a href='announce_list.asp' target='_self' title='示范工程'>ITS示范</a>| <a href='article_list.asp' target='_self' title='技术文章' onmouseover=showmenu(event,0,1,false) onmouseout=delayhidemenu()>技术文章</a>| <a href='pic_list.asp' target='_self' title='技术文章'>研发成果</a>| <a href='its_list.asp' target='_self' title='ITS动态'>ITS动态</a>| <a href='system_list.asp' target='_self' title='系统开发'>系统开发</a>| <a href='team_list.asp' target='_self' title='研发小组'>研发小组</a>| <a href='downloads_list.asp' target='_self' title='下载中心' onmouseover=showmenu(event,1,1,false) onmouseout=delayhidemenu()>软件下载</a>| <a href='lxwm.asp' target='_self' title='联系我们'>联系我们</a></td>

</tr>

</table><table width="760" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<tr>

<tr>

</tr>

</table>

<tr>

<tr>

</tr>

</table>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

<input type=radio value=1 checked name=lgtype>正常登陆 <input type=radio value=2 name=lgtype>隐身登陆

</td>

</tr>

<tr>

</div>

</td>

</tr>

</form>

</table>

<tr>

</tr>

</table></td>

</tr>

</table>

</td>

<tr>

<tr>

</tr>

</table>

<tr>

</tr>

<tr>

<td><table width=95% align=center><tr><td height=24 class='article'><img src='xinwen.gif' width='9' height='15' align=absmiddle> <a href=system_view.asp?id=5 title=交通信号区域协调控制系统>交通信号区域协调控制...</tr><tr><td height=24 class='article'><img src='xinwen.gif' width='9' height='15' align=absmiddle> <a href=system_view.asp?id=4 title=桂林公交问路系统设计>桂林公交问路系统设计</tr><tr><td height=24 class='article'><img src='xinwen.gif' width='9' height='15' align=absmiddle> <a href=system_view.asp?id=3 title=城市道路平面交叉口交通设计辅助系统>城市道路平面交叉口交...</tr><tr><td height=24 class='article'><img src='xinwen.gif' width='9' height='15' align=absmiddle> <a href=system_view.asp?id=2 title=诱导条件下的快速路系统分布式仿真TESS系统>诱导条件下的快速路系...</tr><tr><td align='right'><a href='system_list.asp'><img src=images/more.jpg border=0></a></td></tr></table></td>

</tr>

</table></td>

<tr>

<tr>

</tr>

</table>

<tr>

</tr>

<tr>

<td><table width=95% align=center><tr><td align='center' height=24 class='article'><img src='xinwen.gif' width='9' height='15' align=absmiddle> <a href=team_view.asp?id=5 title=交通系统控制组>交通系统控制组</tr><tr><td align='center' height=24 class='article'><img src='xinwen.gif' width='9' height='15' align=absmiddle> <a href=team_view.asp?id=4 title=公共交通系统组>公共交通系统组</tr><tr><td align='center' height=24 class='article'><img src='xinwen.gif' width='9' height='15' align=absmiddle> <a href=team_view.asp?id=3 title=交通信息系统组>交通信息系统组</tr><tr><td align='center' height=24 class='article'><img src='xinwen.gif' width='9' height='15' align=absmiddle> <a href=team_view.asp?id=2 title=交通系统分析组>交通系统分析组</tr><tr><td align='right'><a href='team_list.asp'><img src=images/more.jpg border=0></a></td></tr></table></td>

</tr>

</table></td>

<tr>

<tr>

</tr>

</table>

<tr>

<tr>

</tr>

</table>

<tr>

</tr>

<tr>

<td height="25">关键字：

</tr>

<tr>

<td height="25"><div align="center">类别：

</select>

</div></td>

</tr>

<tr>

</div></td>

</tr>

</form>

</table>

<tr>

</tr>

</table></td>

</tr>

</table></td>

<tr>

<tr>

</tr>

</table>

<tr>

<tr>

</tr>

</table>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</table>

<tr>

</tr>

</table></td>

</tr>

</table></td>

<tr>

</table></td>

<tr>

<tr>

</tr>

<tr>

<td width="69%" valign=top><marquee direction='left' loop='-1'><table valign=top border=0><tr><td width='200'><table width='99%'><tr><td><a href='pic_view.asp?id=70'><img src='UploadFile/its9.jpg ' border=0 width='200' height='115'></a></tr><tr><td>桂林市道路网络仿真系统</td></tr></table></td><td width='200'><table width='99%'><tr><td><a href='pic_view.asp?id=69'><img src='UploadFile/its8.jpg ' border=0 width='200' height='115'></a></tr><tr><td>桂林公交问路系统设计</td></tr></table></td><td width='200'><table width='99%'><tr><td><a href='pic_view.asp?id=68'><img src='UploadFile/its7.jpg ' border=0 width='200' height='115'></a></tr><tr><td>便携式汽车称重系统</td></tr></table></td><td width='200'><table width='99%'><tr><td><a href='pic_view.asp?id=67'><img src='UploadFile/its6.jpg ' border=0 width='200' height='115'></a></tr><tr><td>交通信号区域协调控制系统</td></tr></table></td><td width='200'><table width='99%'><tr><td><a href='pic_view.asp?id=66'><img src='UploadFile/its5.jpg ' border=0 width='200' height='115'></a></tr><tr><td>基础交通数据检测分析系统</td></tr></table></td><td width='200'><table width='99%'><tr><td><a href='pic_view.asp?id=65'><img src='UploadFile/its4.jpg ' border=0 width='200' height='115'></a></tr><tr><td>ITS共用信息平台技术</td></tr></table></td><td width='200'><table width='99%'><tr><td><a href='pic_view.asp?id=64'><img src='UploadFile/chldw2.jpg ' border=0 width='200' height='115'></a></tr><tr><td>车辆定位、监控与导航系统</td></tr></table></td><td width='200'><table width='99%'><tr><td><a href='pic_view.asp?id=63'><img src='UploadFile/0225.jpg ' border=0 width='200' height='115'></a></tr><tr><td>高速公路数据库管理系统</td></tr></table></td><td width='200'><table width='99%'><tr><td><a href='pic_view.asp?id=62'><img src='UploadFile/0224.jpg ' border=0 width='200' height='115'></a></tr><tr><td>视频电子警察系统</td></tr></table></td></tr></table></marquee></td>

</tr>

</table>

</td>

<tr>

</object></td></tr>

</table>

</td>

<tr>

<tr>

</tr>

</table>

<table

1.全屏网页设计

很多网站开始采用全屏网页设计，利用精心挑选设计的漂亮背景，加上合理的页面布局，视觉冲击力大可很好的吸引观者注意。通常页面内的文字内容不会特别多(所出现的少量文字加上精美的排版将会变得更加吸引人)，主要以图片展示为主。这个样子的网站多用于摄影团队或个人作品集展示会比较常见。虽然简单养眼，但是承载信息有限，公司部门的主页很少见这样的设计。

2.响应式网页设计

3.扁平化设计

扁平化设计可以说是去繁从简的设计美学。去掉所有装饰性的设计，可以说是对之前所推崇的拟物化设计的颠覆。我们不能妄加评论说这是好还是不好，只能说它提供了一种新的设计思维。

4.视差滚动设计

视差设计可以说是近年来网页设计中的一大突破，也备受推崇。视差滚动是让多层背景以不同速度滚动，以形成一种3D立体的运动效果，给观者带来一种独特的视觉感受。

5.无限滚动模式

有一些网站内容很多，但他们并没有简单分页，而是采用的是一种垂直瀑布流的方式布局。将那些内容垂直排布，当用户纵向滚动时，内容会不断更新好像永无止境。这样的瀑布流很早之前就开始流行，最早采用该布局的是pinterest。这样的滚动页面就大大减少了分页的数量，个人认为对于这类信息量大，每日更新数据快的网站是比较不错的方案。

6.滚动侦测网页设计

利用CSS的实现将导航栏固定在网页顶部(大多数是顶部，当然也有侧面或底部)，并将版面内容按照导航顺序垂直或横向排布，使得用户点击相应导航tab时页面自动滑到相应页面，而若点击内容，导航也将随之改变。这样的网页设计页面基本不会跳转，每一个tab所指向的页面内容也基本一屏显示完整，所以在页面呈现的内容上会有所局限。为不影响布局一般也会伴随自适应。

楼上的回答不对。他主要应用了以下两段代码：

【更改背景】

修改模板的时候可以灵活运用下面的代码，有些部分可以不改，不想改哪项就把哪项的代码删掉就可以了。

<TBODY>

<TR>

<TD>

<STYLE>

body

{background:url("页面大背景图片地址") repeat scroll!important}

.logo

{background:url("题图上背景图片地址") no repeat no scroll!mportant}

.banner

{background:url("题图下背景图片地址") no repeat no scroll!mportant}

.menu

{background:url("题图下的菜单背景图片地址") no-repeat center}

.feeds .up

{background:url("正文标题栏上翻时的图片地址") no-repeat center}

.feeds .down

{background:url("正文标题栏下翻时的图片地址") no-repeat center}

.feeds .function

{background:url("正文摘要结尾处菜单的图片地址") no-repeat right}

.links .up

{background:url("面板标题栏上翻时的图片地址")}

.links .down

{background:url("面板标题栏下翻时的图片地址")}

.links .mid

{background:url("面板的背景图片地址")}

.photo .mid

{background:url(个人形象照片处的背景图片地址)}

.label .mid

{background:url("自定义面板的背景图片地址")}

.calendar .mid

{background:url("日历面板背景图片地址")}

.callboard .up

{background:url("公告栏标题栏上翻时的图片地址")}

.callboard .down

{background:url("公告栏标题栏下翻时的图片地址")}

.callboard .mid

{background:url("公告栏背景图片地址")}

.bodyBg

{background:url("正文背景图片地址")}

.bodyBottom

{background:url("正文背景图片地址")}

.gbook .up

{background:url("留言板标题栏上翻时的图片地址") no-repeat}

.gbook .down

{background:url("留言板标题栏下翻时的图片地址") no-repeat}

.feeds .page

{background:url("正文文章页数图片地址") no-repeat center}

</STYLE>

解释：

“页面大背景(body)”指的是整个博客的最大背景，由于中间部分被覆盖，所以显示的效果只是两边的部分。

“题图上背景(logo)”是指所在的横长条的背景。

“题图下背景(banner)”是指博客名字（如）和博客地址（如）所在的那部分的背景。

其中logo和banner宽各为770，logo高40，banner高134，单位均为像素。

“题图下的菜单背景”是指“HOME...搜索┆帮助┆退出”等字所在的那个横长条的背景。

“正文标题栏上翻时的图片”指的是文章发表了之后文章标题的图片。

“面板标题栏下翻时的图片”指的是点击标题后出现标题后的后面的图片。

“面板的背景图片”指的是左边比如我的文章列表什么的背景图片。

“页面内背景”是指整个文章文字所在的大背景！

修改模板的时候可以灵活运用上面的代码，有些可以不要改，不想改哪项就把哪项的代码删掉就可以了。

假如不知道这些背景图片的大小，就具体在哪张图片上就点击鼠标右键，点背景另存为，把图片存到电脑上，然后看大小就可以了。

注意：以上所用到的图片地址都是图片的URL地址，也就是网络地址，而不是本地地址，本地地址不能用。

这些都是CSS代码，代码不能添加在什么都没有的空白面板里，要不然会没有效果。

在添加空白面板的时候，先按个空格键，接着在显示源代码前打勾，再把代码放进去；或者可以把代码放在已建的面板里的其他东西的代码后面，比如放在你的时钟代码后面或者天气预报代码后面什么的都可以，建议最好用此方法。

【半透明蒙纱效果】

.logo

{background:#transparent}

.banner

{background:#transparent}

.menu

{background:#transparent}

.feeds .up

{background:#transparent}

.feeds .down

{background:#transparent}

.feeds .function

{background:#transparent}

.links .up

{background:#transparent}

.links .down

{background:#transparent}

.links .mid

{background:#transparent}

.photo .mid

{background:#transparent}

.label .mid

{background:#transparent}

.calendar .mid

{background:#transparent}

.callboard .up

{background:#transparent}

.callboard .down

{background:#transparent}

.callboard .mid

{background:#transparent}

.bodyBg {background:#transparentfilter:progid:DXImageTransform.Microsoft.gradient(GradientType ='1',enabled='true',startColorstr=#AAFFFFFF, endColorstr=#AAFFFFFF)}

.bodyBottom

{background:#transparent}

.sysW770

{background:#transparent}

.gbook .up

{background:#transparent}

.gbook .down

{background:#transparent}

.feeds .page

{background:#transparent}

.links .more

{background:#transparent}