来一发Float菜单程度居中复杂办法

只看该作者 · 发表于 2015-1-15 23:26:36

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

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

x

对相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者页数不同的网页的外观和格式。
网页制造poluoluo文章简介：今天用ucweb看到了goos发的一篇帖子：谁说Float菜单不成以程度居中，出来看了看，以为办法有点烦琐了，用到了负边距，position:relativel;和很少的一点hack。
今天用ucweb看到了goos发的一篇帖子：谁说Float菜单不成以程度居中，出来看了看，以为办法有点烦琐了，用到了负边距，position:relativel;和很少的一点hack。
我这里另有更复杂的举措，先展现：
实在我表面应当再套一个div，但为了削减碳排放，舍弃。
运转代码框
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><styletype="text/CSS">body{font-family:Verdana,Arial,sans-serif;font-size:12px;margin:120pxauto;text-align:center;}ul{margin:0;padding:0;list-style:none;}#navigation{display:inline-block;border:solid1pxred;padding:20px;}#navigationli{height:30px;float:left;}#navigationlia{float:left;height:30px;line-height:30px;padding:023px;background:#97C099;}#navigationlia:hover{background:#59c099;color:#fff;}</style><title>float菜单局中一法</title></head><body><ulid="navigation"><li><ahref="#">Home</a></li><li><ahref="#">News</a></li><li><ahref="#">Store</a></li><li><ahref="#">Group</a></li><li><ahref="#">Community</a></li><li><ahref="#">Help</a></li></ul></body></html>
[Ctrl+A全体选择提醒：你可先修正部分代码，再按运转]
个中最为关头的是这一句：

为了照应较低版本IE，这里利用了前提正文，感到在IE7以下中，display:inline;的感化就相称于inline-block;。
依据下面代码退化而来的滑动门导航：
运转代码框
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><styletype="text/css">body{font-family:Verdana,Arial,sans-serif;font-size:12px;margin:120pxauto;text-align:center;}ul{margin:0;padding:0;list-style:none;}#navigation{display:inline-block;padding:20px;border:solid1pxred;}#navigationli{height:30px;float:left;}#navigationlia{float:left;background:#97C099url(http://home.blueidea.com/attachment/200903/13/381636_1236958262fsCk.gif)lefttopno-repeat;padding-left:27px;height:30px;overflow:hidden;}#navigationliaspan{height:30px;float:left;background:url(http://home.blueidea.com/attachment/200903/13/381636_1236958262fsCk.gif)right-352pxno-repeat;padding-right:27px;line-height:33px;cursor:hand;}#navigationlia:hover,#navigationli.currenta{background-position:left-176px;color:#009;background-color:#8597B5;}#navigationlia:hoverspan,#navigationli.currentaspan{background-position:right-528px;}#navigationli.currenta{font-weight:bold;}</style><title>依据下面代码晋级为滑动门款式</title></head><body><ulid="navigation"><li><ahref="#"><span>Home</span></a></li><li><ahref="#"><span>News</span></a></li><liclass="current"><ahref="#"><span>Store</span></a></li><li><ahref="#"><span>Group</span></a></li><li><ahref="#"><span>Community</span></a></li><li><ahref="#"><span>Help</span></a></li></ul></body></html>
[Ctrl+A全体选择提醒：你可先修正部分代码，再按运转]
个中，这两句有需要申明一下，以避免被以为是过剩的：
#navigationlia{overflow:hidden;}/*埋没失落IE5.5、6多失落的那3px，不是3pxbug哈！由于height:30px;line-height:33px;在IE5.5、6中高度就是33px了。*/
#navigationliaspan{cursor:hand;}/*照应IE5.5、6、7鼠标放在span下面不呈手型的bug。别的，IE5.5不撑持cursor:pointer;但IE全版本都熟悉cursor:hand;*/
竣工了，弱点就是，写那一行前提正文，关于有xhtml洁癖的人来讲，就像眼里的沙子，想撤除，那就利用hack也不妨！呵呵！
在safari4，chorme，opera10，ie5.5、5、6、7,ff3中均暂未发明成绩。
</p>
Table中布局中，垃圾代码会很多，一些修饰的样式及布局的代码混合一起，很不利于直观。而Div更能体现样式和结构相分离，结构的重构性强。

只看该作者 · 发表于 2015-1-17 22:41:35

还可以在Dreamweaver常用工具中选择超级链接，完成相应的填写即可。

只看该作者 · 发表于 2015-1-26 14:21:35

Adobe Dreamweaver CS5 软件使设计人员和开发人员能充满自信地构建基于标准的网站。由于同新的 Adobe CS Live 在线服务 Adobe BrowserLab 集成。

只看该作者 · 发表于 2015-2-4 20:34:51

滚动条)层属性--溢出(visible/hidden/scroll/auto)

只看该作者 · 发表于 2015-2-10 08:43:45

运动)时间轴面板--拖动关键帧--单击整条--将鼠标移至中间一点--右击选择增加关键帧--移动中间关键帧的图层--勾选自动播放,循环

只看该作者 · 发表于 2015-3-1 07:42:46

每天上网看着那样多的网页，于是我才下定决心选择了网页制作这一门课程，目的就是希望以后能够做出一个完美的网页来。

只看该作者 · 发表于 2015-3-10 14:51:34

在刚开始接触网页的第一堂课上，听说网页制作会是一门很无聊并且很难听懂的过程，而事实却印证了这样一个事实。

只看该作者 · 发表于 2015-3-17 08:48:33

Dreamweaver在所见即所得添加链接，也可以先选中文字或图片然后在属性栏中的链接栏后的一个小圆圈，用鼠标点击小圆圈按住不放拖动出箭头然后指向文件即可。

只看该作者 · 发表于 2015-3-24 04:39:31

布局表格、绘制层、制作CSS样式表等，这些内容迷糊了我的视线，真是没想到制作一个精巧别致的网页是如此的困难，可是心有不甘。

		自动登录	找回密码
密码			立即注册

[DIV+CSS] 来一发Float菜单程度居中复杂办法

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

相关帖子