1、网页制作 导航栏和分类栏怎么在子页面也共用呢
首先将导航栏或分类栏目制作成一个独立的文件,这个文件需要根据你使用不同的网页编程语言来进行不同的命名,比如.html .asp .php .jsp;再将这文件放置到需要调用的地方即可:
HTML静态网页调用:
<include file="header.htm" />
ASP网页调用:
<!--#include.file="header.asp"-->
PHP网页调用:
<?php include 'header.php';?>
2、网页制作!求大神指导如何做出以下导航栏效果 急急急!!!!
这个得写js啊,原理:本科生是一个div,它下面的内容是一个ul,div实现一个click方法,写隐藏和显示ul。
3、网页设计 导航栏问题
这段代码比较经典的下拉菜单,不过没有美化,自己要美化的话,对列的项a a:hover的属性进行定义即可,比如定义一个好的背景等。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*
body
#nav
#nav li
#nav li a
#nav li a:hover
#nav li ul
#nav li.show ul
#nav li.show ul li
#nav li.show ul li a
#nav li.show ul ul
#nav li li.show ul
</style>
<script type="text/javascript">
function getCss(elem,property){
if(elem.style[property]){
return elem.style[property];
}
else if(elem.currentStyle){
return elem.currentStyle[property];
}
else if(document.defaultView && document.defaultView.getComputedStyle){
property = property.replace(/([A-Z])/g,'-$1').toLowerCase();
var s = document.defaultView.getComputedStyle(elem,'');
return s&&s.getPropertyValue(property);
}
else{
return null;
}
}
window.onload = function() {
var obj = document.getElementById("nav");
var lis = obj.getElementsByTagName("li");
var arr = new Array();
var uls = obj.getElementsByTagName("ul")[0];
for(var i=0; i<lis.length; i++){
if(lis[i].className.indexOf("firstLevel")>=0){
arr.push(lis[i]);
}
}
for(var i=0; i<lis.length; i++){
lis[i].style.width = obj.offsetWidth/arr.length - 1 + "px";
if(lis[i].className.indexOf("thirdLevel")>=0){
lis[i].parentNode.style.marginLeft = obj.offsetWidth/arr.length - 1 + "px";
lis[i].parentNode.style.marginTop = -parseInt(getCss(uls,"lineHeight")) + "px";
}
lis[i].onmouseover=function(){
this.className+=(this.className.length>0?" ":"") + "show";
}
lis[i].onmouseout=function(){
this.className=this.className.replace(new RegExp("( ?|^)show\\b"), "");
}
}
}
</script>
</head>
<body>
<ul id="nav">
<li class="firstLevel">
<a href="#">一级栏目</a>
<ul>
<li>
<a href="#">二级栏目</a>
<ul>
<li class="thirdLevel"><a href="#">三级栏目</a></li>
</ul>
</li>
<li>
<a href="#">二级栏目</a>
</li>
<li>
<a href="#">二级栏目</a>
</li>
</ul>
</li>
<li class="firstLevel">
<a href="#">一级栏目</a>
<ul>
<li>
<a href="#">二级栏目</a>
<ul>
<li class="thirdLevel"><a href="#">三级栏目</a></li>
</ul>
</li>
<li>
<a href="#">二级栏目</a>
<ul>
<li class="thirdLevel"><a href="#">三级栏目</a></li>
</ul>
</li>
</ul>
</li>
<li class="firstLevel">
<a href="#">一级栏目</a>
<ul>
<li>
<a href="#">二级栏目</a>
<ul>
<li class="thirdLevel"><a href="#">三级栏目</a></li>
</ul>
</li>
<li>
<a href="#">二级栏目</a>
<ul>
<li class="thirdLevel"><a href="#">三级栏目</a></li>
</ul>
</li>
</ul>
</li>
<li class="firstLevel">
<a href="#">一级栏目</a>
<ul>
<li>
<a href="#">二级栏目</a>
<ul>
<li class="thirdLevel"><a href="#">三级栏目</a></li>
</ul>
</li>
<li>
<a href="#">二级栏目</a>
<ul>
<li class="thirdLevel"><a href="#">三级栏目</a></li>
</ul>
</li>
</ul>
</li>
<li class="firstLevel">
<a href="#">一级栏目</a>
<ul>
<li>
<a href="#">二级栏目</a>
<ul>
<li class="thirdLevel"><a href="#">三级栏目</a></li>
</ul>
</li>
<li>
<a href="#">二级栏目</a>
<ul>
<li class="thirdLevel"><a href="#">三级栏目</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</body>
</html>
网页设计 导航栏问题
4、UI设计网页时,导航栏尺寸规格一般是多少
目前ios的尺寸都是_@2x,除了plus需要注意导航栏60PX,底部标签栏148PX,尺寸需要_@3X也就是1.5倍计算。
5、网页制作 导航菜单形式什么意思
导航菜单的实现
首先定义导航外围容器的样式:
#left {
width: 178px;
}
现在外围容器我内们只要简单的定容义其宽度,并赋予left的id名。在left容器中,我们添加一个名为navcontainer的子容器来放置导航菜单。实现导航的标签推荐使用无序列表ul,通过CSS我们可以改变其外观和形式。HTML结构如下:
< div id="navcontainer">
< ul>
< li>< a href="#">Home< /a>< /li>
< li>< a href="#">About me< /a>< /li>
< li>< a href="#">ximicc< /a>< /li>
< li>< a href="#">Articles< /a>< /li>
< li>< a href="#">Photo roll< /a>< /li>
补充
< /ul>
< /div>
ul和li标签构建了一个简单的项目列表,其项目符号默认为小圆点,这是我们不需要的。利用CSS可以去掉那些小圆点,并用背景图片的形式替换以我们制作好的图标:
6、网页设计左侧导航栏
可以用js来实现,给每一项添加鼠标移入事件,当鼠标移入的时候,显示右边提前写好的内容,鼠标移开后再次隐藏。
附件是我写的一个京东页面最头部部分的例子
7、网页制作,如何把页面内容排版居中,内容文字对齐导航栏
这块的内容部分外围应该有一个div,给这个div给如上导航栏的宽度和
块居中(margin:0px
auto)就行
8、如何设计网页导航栏标题
这是初学者可能会问的问题,其实这要具体情况具体分析的:比如如果内容非常多,就要考虑用“国字型”或拐角型;而如果内容不算太多而一些说明性的东西比较多,则可以考虑标题正文型;那几种框架结构的一个共同特点就是浏览方便,速度快,但结构变化不灵活;而如果是一个企业网站想展示一下企业形象或个人主页想展示个人风采,封面性是首选;Flash型更灵活一些,好的Flash大大丰富了网页,但是它不能表达过多的文字信息。还没有提到的就是变化型了,我只是想把这个留给各位朋友了,因为,只有不断的变化才会提高,才会不断丰富我们的网页!
烈火网 www.liehuo.net 推荐阅读苍井空在微博为青海玉上周五(23日),日本AV女优苍井空在自己的微博宣布,拟发起为青海灾民筹款的活...IPv4 地址枯竭的日子何时到来?五一放假安排,2010年劳动节放假三天百度联盟峰会召开 三大举措助力联盟发韩国版兽兽照片下载地址,遭网友疯狂追谷歌街景汽车肩负收集WiFi网络与MAC的关注地球日:共同珍惜资源倡导低碳生活中国电影著作权协会:网吧看电影收费网页灰白:向玉树地震遇难同胞默哀点击弹出div圆角的遮罩层,可关闭可移动类似HAO123.COM的多个搜索引擎跳转效果Tab选项卡效果,兼容IE、火狐、Chrome等网站技术分析报告之——开心网给Dedecms前台/后台添加来源网址功能极点五笔7.1 (x86/x64) 标准版/学习版 导航栏的位置
导航栏能让我们在浏览时容易的到达不同的页面,是网页元素非常重要的部分,所以导航栏一定要清晰、醒目,一般来讲,导航栏要在“第一屏”能显示出来,但是有时第一屏可能会小于上面所说的435px,基于这点考虑,那种横向放置的导航栏要优于纵向的导航栏考虑,原因很简单:如果浏览者的第一屏很矮,横向的仍能全部看到,而纵向的就很难说了,因为窗口的宽度一般是不会受浏览器设置影响的,而纵向的则不确定性要大的多。
网页布局类型
网页布局大致可分为“国”字型、拐角型、标题正文型、左右框架型、上下框架型、综合框架型、封面型、Flash型、变化型,下面分别论述。
1. “国”字型:也可以称为“同”字型,是一些大型网站所喜欢的类型,即最上面是网站的标题以及横幅广告条,接下来就是网站的主要内容,左右分列一些两小条内容,中间是主要部分,与左右一起罗列到底,最下面是网站的一些基本信息、联系方式、版权声明等。这种结构是我们在网上见到的差不多是最多的一种结构类型。
2. 拐角型:这种结构与上一种其实只是形式上的区别,其实是很相近的,上面是标题及广告横幅,接下来的左侧是一窄列链接等,右列是很宽的正文,下面也是一些网站的辅助信息。在这种类型中,一种很常见的类型是最上面是标题及广告,左侧是导航链接。
3. 标题正文型:这种类型即最上面是标题或类似的一些东西,下面是正文,比如一些文章页面或注册页面等就是这种类。
4. 左右框架型:这是一种左右为分别两页的框架结构,一般左面是导航链接,有时最上面会有一个小的标题或标致,右面是正文。我们见到的大部分的大型论坛都是这种结构的,有一些企业网站也喜欢采用。这种类型结构非常清晰,一目了然。
5. 上下框架型:与上面类似,区别仅仅在于是一种上下分为两页的框架。
6. 综合框架型:上页两种结构的结合,相对复杂的一种框架结构,较为常见的是类似于“拐角型”结构的,只是采用了框架结构。
7. 封面型:这种类型基本上是出现在一些网站的首页,大部分为一些精美的平面设计结合一些小的动画,放上几个简单的链接或者仅是一个“进入”的链接甚至直接在首页的图片上做链接而没有任何提示。这种类型大部分出现在企业网站和个人主页,如果说处理的好,会给人带来赏心悦目的感觉。
8. Flash型:其实这与封面型结构是类似的,只是这种类型采用了目前非常游戏行的Flash,与封面型不同的是,由于Flash强大的功能,页面所表达的信息更丰富,其视觉效果及听觉效果如果处理得当,绝不差于传统的多媒体。
9. 变化型:即上面几种类型的结合与变化,比如本站在视觉上是很接近拐角型的,但所实现的功能的实质是那种上、左、右结构的综合框架型。