仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 483|回复: 8
打印 上一主题 下一主题

[学习教程] ASP网页编程之利用Web尺度建站第11天:不必表格的菜单...

[复制链接]
爱飞 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 23:42:01 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
ASP在国内异常流行,因为国内大多使用的是盗版的Windows和盗版的SQLServer,而ASP+COM+SQLServer实际上也是一种不错的搭配,其性能也不输于PHP+MYSQL,特别是Windows系统和SQLServer都有图形界面,比APACHE和MYSQL易于维护,因此对于不重视知识产权的国家来说也是一种不错的选择。web|web尺度|菜单|web尺度|菜单结构开端搭建起来,我入手下手添补内里的内容。起首是界说logo图片:  款式表:#logo{MARGIN:0px;padding:0px;WIDTH:200px;HEIGHT:80px;}

  页面代码:<divid="logo"><atitle="网页计划师"href="http://www.w3cn.org/"></a></div>以上代码如今应当简单了解。先在CSS界说了一个logo的层,然后在页面中挪用它。必要申明的是,为了使网页有更好的易用性,web尺度请求人人给一切的、属于正式内容的图片,加一个alt属性。这个alt属性是用来讲明图片的感化(当图片不克不及显现的时分就显现交换笔墨),以是不要只写成偶然义的图片称号。
  接上去是界说菜单。

1.不必表格的菜单(纵向)
  我们先来看菜单的最后的效果:



  一般办法我们最少嵌套2层表格来完成如许的菜单,距离线接纳在td中设置背景致并拔出1px高的通明GIF图片完成;背景致的瓜代效果接纳td的onmou搜索引擎优化ver事务完成。但检察本菜单的页面代码,你会看到只要以下几句:

<divid="menu">
<ul>
<li><atitle="网站尺度"href="http://www.w3cn.org/webstandards.html">甚么是网站尺度</a></li>
<li><atitle="尺度的优点"href="http://www.w3cn.org/benefits.html">利用尺度的优点</a></li>
<li><atitle="如何过渡"href="http://www.w3cn.org/howto.html">如何过渡</a></li>
<li><atitle="相干教程"href="http://www.w3cn.org/tutorial.html">相干教程</a></li>
<li><atitle="工具"href="http://www.w3cn.org/tools.html">工具</a></li>
<li><atitle="资本及链接"href="http://www.w3cn.org/resources.html">资本及链接</a></li>
</ul>
</div>
  没有效任何table,而用的是无序列<li>,全部菜单的效果完成的奥密完整在于id="menu",我们再来看CSS中关于menu的界说:

  (1)起首界说了menu层的次要款式:#menu{
MARGIN:15px20px0px15px;/*界说层的外边框间隔*/
PADDING:15px;/*界说层的内边框为15px*/
BACKGROUND:#dfdfdf;/*界说背景色彩*/
COLOR:#666;/*界说字体色彩*/
BORDER:#fff2pxsolid;/*界说边框为2px红色线条*/
WIDTH:160px;/*界说内容的宽度为160px*/
}

  (2)其次界说无序列表的款式:

#menuul{
MARGIN:0px;
PADDING:0px;
BORDER:mediumnone;/*不显现边框*/
LINE-HEIGHT:normal;
LIST-STYLE-TYPE:none;

}
#menuli{BORDER-TOP:#FFF1pxsolid;MARGIN:0px;}

  申明:这里用的是id选择器的派生办法界说(参考第7天:CSS进门的先容)了在menu层中的子元素<ul>和<li>的款式。LIST-STYLE-TYPE:none一句暗示不接纳无序列表的默许款式,即:不显现小圆点(我们前面用本人的图标来取代小圆点)。BORDER-TOP:#FFF1pxsolid;则界说了菜单之间的1px距离线。

  (3)界说onmou搜索引擎优化ver效果

#menulia{
PADDING:5px0px5px15px;
DISPLAY:block;
FONT-WEIGHT:bold;
BACKGROUND:url(images/icon_dot_lmenu.gif)transparentno-repeat2px8px;
WIDTH:100%;
COLOR:#444;
TEXT-DECORATION:none;
}
#menulia:hover{BACKGROUND:url(images/icon_dot_lmenu2.gif)#C61C18no-repeat2px8px;
COLOR:#fff;}

  注释以下:

"display:block;"暗示将标签a看成块级元从来显现,使得链接酿成一个按钮;
"BACKGROUND:url(images/icon_dot_lmenu.gif)transparentno-repeat2px8px;"这一句界说了替换li的小圆点的图标。"transparent"指背景为通明,"2px8px"指定图标的地位是距右边2px,距上边8px。这一句也能够拆分写成四句:"BACKGROUND-IMAGE:url(images/icon_dot_lmenu.gif);BACKGROUND-POSITION:2px8px;BACKGROUND-REPEAT:no-repeat;BACKGROUND-COLOR:transparent;"
"#menulia:hover"界说了当鼠标挪动到链接上今后的色彩变更和小图标变更。
  ok,不必表格的菜单就如许完成了。人人能够分明感到到,本来写在HTML里的体现款式全体剥离放到CSS文件里往了。页面代码勤俭了泰半。经由过程CSS要修正菜单款式就很复杂了。


</p>结论:和PHP一样,ASP简单而易于维护,很适合小型网站应用,通过DCOM和MTS技术,ASP甚至还可以完成小规模的企业应用,但ASP的致命缺点就是不支持跨平台的系统,在大型项目开发和维护上非常困难。
谁可相欹 该用户已被删除
沙发
发表于 2015-1-19 09:55:50 来自手机 | 只看该作者
完全不知道到底自己学的是什么。最后,除了教程里面说的几个例子,还是什么都不会。
简单生活 该用户已被删除
板凳
发表于 2015-1-24 12:06:28 | 只看该作者
用户端的浏览器不需要提供任何别的支持,这样大提高了用户与服务器之间的交互的速度。
小妖女 该用户已被删除
地板
发表于 2015-2-1 10:07:24 | 只看该作者
我认为比较好的方法是找一些比较经典的例子,每个例子比较集中一种编程思想而设计的。
变相怪杰 该用户已被删除
5#
发表于 2015-2-7 02:51:43 | 只看该作者
Response:从字面上讲是“响应”,因此这个是服务端向客户端发送东西的,例如Response.Write
金色的骷髅 该用户已被删除
6#
发表于 2015-2-19 22:18:22 | 只看该作者
尽管MS自己讲C#内核中更多的象VC,但实际上我还是认为它和Java更象一些吧。首先它是面向对象的编程语言,而不是一种脚本,所以它具有面向对象编程语言的一切特性,比如封装性、继承性、多态性等等,这就解决了刚才谈到的ASP的那些弱点。
冷月葬花魂 该用户已被删除
7#
发表于 2015-3-6 15:45:42 | 只看该作者
没有坚实的理论做基础,那么我们连踏入社会第一步的资本都没有,特别对于计算机专业的学生学好专业知识是置关重要的。在这里我侧重讲一下如何学习ASP,从平时的学习过程中。
小女巫 该用户已被删除
8#
发表于 2015-3-13 03:57:59 | 只看该作者
那么,ASP.Net有哪些改进呢?
乐观 该用户已被删除
9#
发表于 2015-3-20 11:35:31 | 只看该作者
我可以结合自己的经验大致给你说一说,希望对你有所帮助,少走些弯路。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-12-25 01:41

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表