1、css html制作网页,用ul和li制作横向导航栏
将ul里面的li标签都设置为右浮动即可。如:
<ul style="overflow:hidden; display:block">2、网页设计导航条
下面的代码,你去看看,不好用再说。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
<!--
body {
background-color: #0099FF;
}
#navigation {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
#navigation ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
#navigation li {
border-bottom-style: none;
border-bottom-color: #ed9f9f;
border-top-style: none;
border-right-style: none;
border-left-style: none;
border-top-color: #ed9f9f;
border-right-color: #ed9f9f;
border-left-color: #ed9f9f;
float: left;
}
#navigation li a {
text-decoration: none;
display: block;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 0.5em;
border-right-width: 1px;
border-left-width: 12px;
border-right-style: solid;
border-left-style: solid;
border-right-color: #711515;
border-left-color: #711515;
border-top-style: none;
border-bottom-style: none;
width: 50px;
text-align: center;
margin: 0px;
}
#navigation li a:link, #navigation li a:visited {
color: #FFFFFF;
background-color: #c11136;
}
#navigation li a:hover {
color: #ffff00;
background-color: #990020;
}
#navigation ul li:hover ul,#navigation ul a:hover ul {
visibility: visible;
}
#navigation ul ul {
visibility: hidden;
}
#navigation ul ul li {
clear: both;
}
#navigation ul ul li a {
border: 1px solid #CCCCCC;
}
#navigation ul ul li a:link, #navigation ul ul li a:visited {
color: #000000;
background-color: #FFCC66;
}
#navigation ul ul li a:hover {
color: #006699;
background-color: #99CC00;
}
.nav {
border: 1px solid #0099CC;
position: absolute;
width: 357px;
left: 112px;
top: 34px;
}
.nav ul {
margin: 0px;
padding: 0px;
list-style-type: none;
font-size: 12px;
}
.nav li {
float: left;
}
.nav li a {
border: 1px solid #FF3333;
display: block;
padding: 5px;
background-color: #FFCC33;
text-decoration: none;
}
-->
</style>
</head>
<body>
<div id="navigation">
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">关于我们</a></li>
<li><a href="#">产品展示</a>
<div>
<ul>
<li><a href="#">产品1一</a></li>
<li><a href="#">产品2一</a></li>
<li><a href="#">产品3一</a></li>
<li><a href="#">产品4一</a></li>
<li><a href="#">产品5一</a></li>
<li><a href="#">产品6一</a></li>
</ul>
</div>
</li>
<li><a href="#">联系电话</a>
<div>
<ul>
<li><a href="#">产品1一</a></li>
<li><a href="#">产品2一</a></li>
<li><a href="#">产品3一</a></li>
<li><a href="#">产品4一</a></li>
<li><a href="#">产品5一</a></li>
<li><a href="#">产品6一</a></li>
</ul>
</div>
</li>
<li><a href="#">公司介绍</a></li>
</ul>
</div>
</body>
</html>
3、网页设计怎样插入UL LI 这样表格
你可以直接写代码;形如:
<ul>
<li>内容1</li>
<li>内容2</li>
<li>内容3</li>
......
</ul>
4、网页设计中,为什么都用<UL><LI>标签来制作导航条,有什么好处?
列表式导航条代码简洁有序,且易于编排
5、网页设计中的.top ul li:hover a表示什么意思 求指教
表示定义一个按照元素层级关系限定的CSS样式。
即:要求元素的层级关系,首先是最外层元素要包含.top样式,其次再去寻找下面ul元素,再找到ul下面的li,再找到li下面的a标签元素。
上面这个样式的意思是当鼠标移动到li元素上时,它下面的a标签将会按照这个样式进行渲染。
样式的这种定义方式只对满足上述结构的元素生效,像如下结构的代码,将不会拥有上述定义的样式:
<div class="top">6、自学ul设计和网站设计用什么软件呢高手来回答初学怎么入门呢
PS和AI 学完这两个其他都比较简单了,譬如fireworks,都是同一家公司的,界面也差不多。入门看下一些APP,或者在线视频学习。
7、关于asp.net网页设计中<ul><li>排版问题
其实一般要实现你所要的效果用tab菜单就能解决,但是最大的问题是很容易造成单个页面数据内容过多造成用户浏览页面的时候加载太慢
所以一般网站实现点击导航显示不同内容的方法,无非就是页面跳转,就比如导航分为动作、科幻、爱情。。。,那么你也要分别为这几类做页面,你考虑用框架做会更方便;
我花几分钟写了大概一个示例,你打开文件UntitledFrameset-7.html,点击3个不同的导航就能跳转到不同的页面
我这给你的只是方法思路,细节内容还得你自己做
8、网页制作中,如何让我的ul里边的li内容居中显示啊?text-agin-center.也不行
li {
display: inline-block;
width: 114px;
height: 46px;
font-size: 18px;
text-align: center;
}