请高手帮我改改这个CSS(本页内导航)

2023-02-19 19:07:01html-css011

请高手帮我改改这个CSS(本页内导航),第1张

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>简洁Tab</title>

<!--

body,div,ul,li{

margin:0

padding:0

}

body{

font:12px "宋体"

text-align:center

}

a:link{

color:#00F

text-decoration:none

}

a:visited {

color: #00F

text-decoration:none

}

a:hover {

color: #c00

text-decoration:underline

}

ul{

list-style:none

}

.main{

clear:both

padding:8px

text-align:center

}

#tabs0 {

height: 200px

width: 100px

border: 1px solid #cbcbcb

background-color: #f2f6fb

}

.menu0{

width: 100px

}

.menu0 li{

display:block

float: left

padding: 0px

width:100px

text-align: center

cursor:pointer

background: #FFFFff

}

.menu0 li.hover{

background: #f2f6fb

}

#main0 ul{

display: none

}

#main0 ul.block{

display: block

}

-->

</style>

<!--

function setTab(m,n){

var tli=document.getElementById("menu"+m).getElementsByTagName("li")

var mli=document.getElementById("main"+m).getElementsByTagName("ul")

for(i=0i<tli.lengthi++){

tli[i].className=i==n?"hover":""

mli[i].style.display=i==n?"block":"none"

}

//-->

</script>

</head>

<body>

<br />

</ul>

</div>

</body>

</html>

不知道是不是你想要的效果。

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html，输入问题基础代码。

2、在index.html中的<style>标签中，输入css代码：body {text-align:center}，在<script>标签中输入js代码：

var a = ($(document).height() - $('form').height()) / 2

$('form').css('margin-top', a + 'px')

3、浏览器运行index.html页面，此时form标签成功在页面中水平垂直居中了。

已经给你从新修改。参见http://hi.baidu.com/coleyinhe 的效果，下面代码里的图片是你要的那个心的，鼠标那也是，你自己试试啦，，我空间上我也改啦。。第一次玩空间。。。顺便帮你弄的时候也自己弄个玩玩。。。。以后有什么这些网页语言方面的我都能帮你啦。。代码里的注释已经写得很清楚了。可以根据自己要求改改的。还有什么不对的地方，我再给你弄弄，导航栏的主页博客|相册|个人档案 |好友 |设置这些，如果你要和原来那样或者其他颜色的话。我也可以给你改下，在代码里我也已经标出来了。用16进制的颜色代码写就可以了。----------以下是完整CSS代码------------***************************************---------------------------------------body{background:#000CURSOR: url('http://webme.bokee.com/inc/mouse009.ANI')}/*这里是鼠标的图片*/a:hover{CURSOR: url('http://webme.bokee.com/inc/mouse009.ANI')}/*这里是鼠标碰到连接后的图片*/a:hover {position:relativeleft:1pxtop:1pxclip:rect()}/*body{background:#7CC7FF}/* /*本行为默认模板的，即背景为蓝色，而背景图片不是全部都是的那种*/body{background:url(http://hiphotos.baidu.com/%F6%AD%C0%C7/pic/item/c479b51ce707c98b87d6b6d0.jpg

" target="_blank" >http://hiphotos.baidu.com/%F6%AD%C0%C7/pic/item/c479b51ce707c98b87d6b6d0.jpg

) no-repeatbackground-position: centerbackground-attachment: fixed} /*版权所有cole,[email protected],QQ356572960,允许复制，但请保留该版权信息，否则将动用技术手段破坏！*//*注释说明：如需要修改各分类或者评论以及友情连接这些的那框的高度，超过高度后自动出现滚动条的，那么这个高度设置就是下边注释中 height:500px 这里，height代表高度的意思，500px代表高度尺寸，可以自己设置成1000px 2000px 100px等等*//*色彩配置的注释说明：如需要修改各地段色彩类，请修改代码内如#FFFFFF的，这里使用的是16进制的，可以在一些做图的软件上的调色板里，找到你要的颜色，一般上边都会有一个代码，这个就是这里写的代码了*//*其实CSS样式表的语法格式很简单的，即使不会的人，上边很多语法都是用英文单词的，还有一些参数值，会ASP这些技术的人应该都会啦。。*/#header{height:89pxbackground:url() repeat-x }/*这里是蓝色的那块，就是LOGO后边的那，他是一个小图片，然后拉伸得到的，你也可以直接放大图，但尽量是1024长度的，不然会出现多个相同图片的效果*/#header div.lc{}#header div.rc{background:url(http://zz53.com/images/111.gif) no-repeat top right}/*这里是蝴蝶的那LOGO的地方修改里边的地址即可修改LOGO*/#header div.tit{top:8pxleft:20pxline-height:22pxfont-size:20pxfont-family:黑体}#header div.tit a.titlink{color:#FFFFFFtext-decoration:none}#header div.tit a.titlink:visited{color:#FFFFFFtext-decoration:none}#header div.desc{top:33pxleft:20pxcolor:#FFFFFFfont-size:13px}#tabline{top:89px}/*#tab{top:67pxbackground:#0186E9}*/#tab{top:67pxbackground:filter:alpha(opacity=50)} /*这里有部分是那导航栏的*/#tab a.on,#tab a.on:link,#tab a.on:visited{margin-top:0pxline-height:22pxbackground-color:#7CC7FFcolor:#000000font-size:14px}#tab span{color:#FFFFFFfont-size:14px}#tab a:link{color:#FFFFFFtext-decoration:nonefont-size:14px}#tab a:visited{color:#FFFFFFtext-decoration:nonefont-size:14px} #tab2{background:#DAE9F5}#tab2 span{color:#000000font-size:12pxfont-weight:bold}#tab2 a{font-size:12px}#tab2 a:link{color:#0000CC}#tab2 a:visited{color:#0000CC} /*这里这堆是顶部的*//* .stage{background:url(http://hiphotos.baidu.com/%F6%AD%C0%C7/pic/item/c479b51ce707c98b87d6b6d0.jpg

" target="_blank" >http://hiphotos.baidu.com/%F6%AD%C0%C7/pic/item/c479b51ce707c98b87d6b6d0.jpg

) bottom no-repeat }*/ /*这里是背景图片*/.stage{}#comm_info{color:#666666font-family:Arialtext-align:left}#comm_info div.line{margin-top:5pxline-height:8pxborder-top:1px solid #ECECECbackground:url(http://www.ip.cn/s.php) no-repeat bottompadding-bottom: 40pxmargin-bottom: 10px}background:url(http://www.ip.cn/s.php) no-repeat bottompadding-bottom: 40pxmargin-bottom: 10px#comm_info a{color:#1A991E}#page{height:30pxfont-size:14pxfont-family:Arialtext-align:center}#page span{padding:3pxcolor:#000000font-size:14pxfont-weight:bold}#page a.pc{color:#1A991Efont-size:14pxfont-weight:bold}#page a.pc:visited{color:#1A991E}#page a.pi{padding:3pxcolor:#1A991Efont-size:14px}#page a.pi:visited{color:#1A991E}.mod{margin-bottom:10px}.modhandle{cursor:move}.modth{height:24px}.modhead{padding:4px 4px 0 4px}.modopt{padding:4px 4px 0 0}.modtit{color:#0092FFfont-size:12pxfont-weight:bold}a.modtit{color:#0092FF}a.modtit:visited{color:#0092FF}.modtitlink{color:#FFFFFFfont-size:12pxfont-weight:bold}a.modtitlink{color:#FFFFFFtext-decoration:none}a.modtitlink:visited{color:#FFFFFFtext-decoration:none}a.modtitlink:hover{color:#FF5100text-decoration:underline}.modact{color:#0092FFfont-size:12px}a.modact:link{color:#0092FF}a.modact:visited{color:#0092FF}.modbox{padding:10px 10px 0 10pxbackground-color:#FFFFFFborder-left:1px solid #FFFFFFborder-right:1px solid #FFFFFF}.modtl{background:url(http://img.baidu.com/hi/temp7/ptitl.gif) no-repeat top leftline-height:1px}.modtc{background:url(http://img.baidu.com/hi/temp7/ptitc.gif) repeat-x}.modtr{background:url(http://img.baidu.com/hi/temp7/ptitr.gif) no-repeat top rightline-height:1px}.modbox,.modbl,.modbc,.modbr{filter:alpha(opacity=60)-moz-opacity:0.8width:auto !importantwidth:100%}/*上面这行是透明度的设置，也就是页面和背景的透明度，opacity=60这里可以自己修改，60表示60%的意思*/.modbl{background-color:#FFFFFFborder-left:1px solid #FFFFFFborder-bottom:1px solid #FFFFFFline-height:1px}.modbc{background-color:#FFFFFFborder-bottom:1px solid #FFFFFFline-height:1px}.modbr{background-color:#FFFFFFborder-right:1px solid #FFFFFFborder-bottom:1px solid #FFFFFFline-height:1px}#m_blog{overflow-y:autoheight:500pxscrollbar-face-color:#AAAAAAscrollbar-highlight-color:#fffscrollbar-shadow-color:#000scrollbar-arrow-color:#4b0082scrollbar-base-color:#AAAAAAscrollbar-dark-shadow-color:#69f}/*文章的那滚动条*/#m_blog div.tit{color:#8A3506font-size:14pxfont-weight:boldbackground:url(http://zz53.com/images/222.gif) no-repeat top lefttext-indent: 22pxheight:70pxline-height:75px}#m_blog div.tit a{color:#1A991Efont-size:14pxfont-weight:bold}#m_blog div.tit a:visited{color:#1A991E}#m_blog div.date{margin:5px 0 8px 0color:#999999}#m_blog div.cnt{color:#666666line-height:20pxfont-size:14px}#m_blog div.more{margin:14px 0 16px 0}#m_blog div.more a{color:#1A991Efont-size:14px}#m_blog div.more a:visited{color:#1A991E}#m_blog div.opt{color:#999999font-size:12px}#m_blog div.opt a{color:#1A991Efont-size:12px}#m_blog div.opt a:visited{color:#1A991E}#m_blog div.line{margin-top:17pxline-height:17pxborder-top:1px solid #ECECEC}#m_blog div.none{padding:100px 0 100px 0color:#666666font-size:14px}/*标题的框*/#m_pro a{color:#1A991E}#m_pro a:visited{color:#1A991E}#m_pro div.image{text-align:center}#m_pro div.act{margin-top:10px}#m_pro div.user{margin-top:10pxcolor:#666666font-size:12pxfont-weight:bold}#m_pro div.desc{color:#666666font-size:12px}#m_pro div.line{margin-top:17pxline-height:17pxborder-top:1px solid #ECECEC}#m_pro td{color:#666666line-height:24pxfont-size:14px}#m_album{overflow-x:autoheight:250px} /*这里因为如果没有此限制参数，大图片的时候可能造成整个框架的变形，所以务必保留此项，如不喜欢可以在前面加/*或直接删除即可*/#m_album{overflow-y:autoheight:120pxscrollbar-face-color:#AAAAAAscrollbar-highlight-color:#fffscrollbar-shadow-color:#000scrollbar-arrow-color:#4b0082scrollbar-base-color:#AAAAAAscrollbar-dark-shadow-color:#69f}/*这里是图片也就是像册的那滚动条*/#m_album div.image{text-align:center}#m_album div.page{color:#666666font-size:12pxtext-align:center}#m_album div.page a{color:#0000CCfont-size:12px}#m_album div.page a:visited{color:#0000CC}#m_links{overflow-y:autoheight:200pxscrollbar-face-color:#AAAAAAscrollbar-highlight-color:#fffscrollbar-shadow-color:#000scrollbar-arrow-color:#4b0082scrollbar-base-color:#AAAAAAscrollbar-dark-shadow-color:#69f}/*友情连接的那里*/#m_links div.item{color:#666666font-size:12px}#m_links div.item a{color:#1A991Efont-size:12pxtext-decoration:none}#m_links div.item a:visited{color:#1A991E}#m_links div.line{margin-top:5pxline-height:8pxborder-top:1px solid #ECECEC}#m_artclg{overflow-y:autoheight:120pxscrollbar-face-color:#AAAAAAscrollbar-highlight-color:#fffscrollbar-shadow-color:#000scrollbar-arrow-color:#4b0082scrollbar-base-color:#AAAAAAscrollbar-dark-shadow-color:#69f}/*文章分类的那滚动条*/#m_artclg div.item{color:#666666font-size:12px}#m_artclg div.item a{color:#1A991Efont-size:12px}#m_artclg div.item a:visited{color:#1A991E}#m_artclg div.line{margin-top:5pxline-height:8pxborder-top:1px solid #ECECEC}#m_filed div.item{color:#666666font-size:12px}#m_filed div.item a{color:#1A991Efont-size:12px}#m_filed div.item a:visited{color:#1A991E}#m_filed div.line{margin-top:5pxline-height:8pxborder-top:1px solid #ECECEC}#m_comment{overflow-y:autoheight:120pxscrollbar-face-color:#AAAAAAscrollbar-highlight-color:#fffscrollbar-shadow-color:#000scrollbar-arrow-color:#4b0082scrollbar-base-color:#AAAAAAscrollbar-dark-shadow-color:#69f}/*最新评论的那滚动条*/#m_comment div.item{color:#666666font-size:12px}#m_comment div.item a{color:#1A991Efont-size:12px}#m_comment div.item a:visited{color:#1A991E}#m_comment div.item a.cnt{color:#666666font-size:12pxtext-decoration:none}#m_comment div.item a.cnt:visited{color:#666666text-decoration:none}#m_comment div.item a.cnt:hover{color:#666666text-decoration:underline}#m_comment div.line{margin-top:5pxline-height:8pxborder-top:1px solid #ECECEC}#m_albumlist div.note{color:#666666font-size:14px}#m_albumlist div.desc{margin-bottom:12pxpadding:3px 10px 3px 10pxline-height:22pxbackground-color:#F2F2F2font-size:14px}#m_albumlist div.none{padding:100px 0 100px 0color:#666666font-size:14px}#m_albumlist div.line{margin-top:10pxline-height:16pxborder-top:1px solid #ECECEC}#m_albumlist div.tit{margin:6px 0 7px 0color:#666666font-size:14px}#m_albumlist div.tit a{color:#1A991Efont-size:14px}#m_albumlist div.tit a:visited{color:#1A991E}#m_albumlist span.count{color:#666666font-size:12pxfont-weight:bold}#m_albumlist span.size{color:#999999font-size:12pxfont-family:Arial}#m_albumlist a.act{color:#1A991Efont-size:12px}#m_albumlist a.act:visited{color:#1A991E}#m_albumlist a.page{color:#0000CCfont-size:14px}#m_albumlist a.page:visited{color:#0000CC}#m_albumlist td.image{padding:5pxborder:1px solid #999999background:#FFFFFF}/*这里是像册列表的，就是点导航栏后进入的像册*/#m_friend div.filter{margin-bottom:10pxpadding-left:10pxpadding-top:10pxheight:27pxline-height:27px}#m_friend div.catalog{margin-bottom:10pxpadding-left:10pxheight:27pxline-height:27pxbackground-color:#F2F2F2font-size:14px}#m_friend div.user{margin-top:4pxcolor:#666666font-size:12px}#m_friend div.user a{color:#1A991Efont-size:12px}#m_friend div.user a:visited{color:#1A991E}#m_friend div.line{margin-top:10pxline-height:16pxborder-top:1px solid #ECECEC}#m_setting a{color:#1A991E}#m_setting a:visited{color:#1A991E}#m_setting{line-height:22pxcolor:#666666font-size:14px}#m_setting img.sel{border:4px solid #FFDB7B}#m_setting img.unsel{border:1px solid #D2D2D2}#m_setting span.tit{font-size:14px}#m_setting span.usr{color:#666666}#m_setting div.sel{padding-top:6pxfont-size:14pxfont-weight:bold}#m_setting div.line{margin-top:20pxline-height:16pxborder-top:1px solid #ECECEC}#m_sysinfo a{color:#1A991E}#m_sysinfo a:visited{color:#1A991E}#m_sysinfo{line-height:22pxcolor:#666666font-size:14px}#m_sysinfo span.new{color:#FF0000font-size:10pxfont-family:Arial}#m_sysinfo span.date{color:#666666font-size:14px}#m_setbase{color:#666666font-size:14px}#m_setbase td{color:#666666font-size:14px}#m_setbase div.line{margin-top:5pxline-height:8pxborder-top:1px solid #ECECEC}#in_comment{width:710px}#in_comment div.tit{margin-bottom:12pxcolor:#666666font-size:14pxfont-weight:bold}#in_comment div.user{margin-bottom:6pxcolor:#666666font-size:12px}#in_comment div.user a{color:#1A991Efont-size:12px}#in_comment div.user a:visited{color:#1A991E}#in_comment div.user span.date{color:#666666font-size:12px}#in_comment div.desc{color:#666666font-size:12px}#in_comment div.line{margin-top:17pxline-height:17pxborder-top:1px solid #ECECEC}#in_send div.tit{margin:10px 0 10px 0color:#666666font-size:14pxfont-weight:bold}

词库加载错误未能找到文件“E高铁采集器内存溢出ConfigurationDictStopwordstxt”

# 上一篇：css3伸缩盒子强制换行

# 下一篇：html背景图片全屏设置，但是却有白边，而且图片有些模糊