HTML转换JS(javascr
css-自动换行
css定义字体垂直居中
文字的行高
比如 line-height: 22px;
就是高22像素,它就会在中间了
---------------------------------------------------
左右分列
这个做的过程中郁闷了下，其实是自己粗心，定义了右边左对齐，左边没有对齐
程序代码
<div style="float:left;>
我在左边
</div>
<div style="float:right;>
我在右边
</div>
或者
程序代码
#Content #middle #left {
float: left;
}
#Content #middle #riht {
float: left;
}
----------------------------------------------
网页TIP的简单作法
程序代码
#infobox span{ display: none; }
#infobox a:hover span{display: block;position:absolute;}
程序代码
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>zishu test tip</title>
<style>
/* zishu.cn */
*{ margin:0; padding:0; list-style:none; font-size:12px; line-height:1.8;}
body{ background: #333}
#info{padding:50px;}
#infobox{padding:0px 20px;background-color: #640000;}
#center{background: #ABBAAC; border-top:2px solid #333; padding:20px;}
.c{ clear:both; height:1px; overflow: hidden; background:#333}
#infobox li{ border-right:1px solid #000; float:left; margin-right:1px; text-align:center;margin-top:-4px; }
a{ width:100px;line-height:28px; display:block;}
a:link,a:visited{color:#000;background:#FF9900;text-decoration: none;}
a:hover,a:active{ color:#FFFF00;background:#000;}
/*以是下显示TIP的内容*/
#infobox span{ display: none; }
#infobox a:hover span{display: block;position:absolute;border:1px solid #640000;background: #FFFFCC;margin-top:26px!important; margin-top:20px;color:#000;padding:5px;white-space: nowrap;}
</style>
</head>
<body>
<div id="info">
<div id="infobox">
<ul>
<li><a href="http://www.nicemood.net" target="_blank"><span>从这里可以进入我的首页！</span>网站首页</a></li>
<li><a href="http://www.nicemood.net" target="_blank"><span>这里边有一些英语和笑话！</span>英语笑话</a></li>
<li><a href="http://www.nicemood.net" target="_blank"><span>这里都是一些朋友的网站！</span>友情链接</a></li>
<li><a href="http://www.nicemood.net" target="_blank"><span>你要有什么要说的就来这！</span>给我留言</a></li>
<li><a href="http://www.nicemood.net" target="_blank"><span>是自已写的和收集的文章！</span>技术文章</a></li>
<li><a href="http://www.nicemood.net" target="_blank"><span>没有了都放在日记里面了！</span>生活照片</a></li>
</ul>
<div class="c"></div>
</div>
<div id="center">
</div>
</div>
</body>
</html>
----------------------------------------------------------------
11月11日
细线分隔线
程序代码
<hr noshade size=0 color=#C0C0C0>
程序代码
<hr width="长度" size="高度" color="颜色代码" noshade>
noshade为有无阴影
打开窗口即最大化
程序代码
<script language="JavaScript">
<!-- Begin
self.moveTo(0,0)
self.resizeTo(screen.availWidth,screen.availHeight)
// End -->
</script>
让垂直的滚动条隐藏
在<body> 或 <div>中加入style="overflow-y:hidden"即可
如：
<body style="overflow-y:hidden">
另外：<body style="overflow-x:hidden">可以隐藏横向滚动条
最简单的就<body scroll=no>就可以了
----------------------------------------------------------------
11月23日
CSS样式
a:link：表示已经链接；
a:hover：表示鼠标移上链接时；
a:active：表示链接激活时；
a:visited：表示己点击过的链接。
滚动条颜色代码
程序代码
BODY{
SCROLLBAR-FACE-COLOR: #FFFFFF;
SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF;
SCROLLBAR-SHADOW-COLOR: #FFFFFF;
SCROLLBAR-3DLIGHT-COLOR: #FFCBC8;
SCROLLBAR-ARROW-COLOR: #FFFFFF;
SCROLLBAR-TRACK-COLOR: #FFFFFF;
SCROLLBAR-DARKSHADOW-COLOR: #FFCBC8;
SCROLLBAR-BASE-COLOR: #FFFFFF
}
----------------------------------------------------------------
12月17日
嵌套DIV:父DIV的高度不能根据子DIV自动变化的解决方案
<div id="parent">
<div id="content"> </div>
</div>
当Content内容多时，即使parent设置了高度100%或auto,在不同浏览器下还是不能完好的自动伸展。 解决方案
<div id="parent">
<div id="content"></div>
<div style="font: 0px/0px sans-serif;clear: both;display: block"> </div>
</div>
在层的最下方产生一个高度为1的空格，可解除这个问题
金东浩博客随机日志
文字的行高
比如 line-height: 22px;
就是高22像素,它就会在中间了
---------------------------------------------------
左右分列
这个做的过程中郁闷了下，其实是自己粗心，定义了右边左对齐，左边没有对齐
程序代码
<div style="float:left;>
我在左边
</div>
<div style="float:right;>
我在右边
</div>
或者
程序代码
#Content #middle #left {
float: left;
}
#Content #middle #riht {
float: left;
}
----------------------------------------------
网页TIP的简单作法
程序代码
#infobox span{ display: none; }
#infobox a:hover span{display: block;position:absolute;}
程序代码
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>zishu test tip</title>
<style>
/* zishu.cn */
*{ margin:0; padding:0; list-style:none; font-size:12px; line-height:1.8;}
body{ background: #333}
#info{padding:50px;}
#infobox{padding:0px 20px;background-color: #640000;}
#center{background: #ABBAAC; border-top:2px solid #333; padding:20px;}
.c{ clear:both; height:1px; overflow: hidden; background:#333}
#infobox li{ border-right:1px solid #000; float:left; margin-right:1px; text-align:center;margin-top:-4px; }
a{ width:100px;line-height:28px; display:block;}
a:link,a:visited{color:#000;background:#FF9900;text-decoration: none;}
a:hover,a:active{ color:#FFFF00;background:#000;}
/*以是下显示TIP的内容*/
#infobox span{ display: none; }
#infobox a:hover span{display: block;position:absolute;border:1px solid #640000;background: #FFFFCC;margin-top:26px!important; margin-top:20px;color:#000;padding:5px;white-space: nowrap;}
</style>
</head>
<body>
<div id="info">
<div id="infobox">
<ul>
<li><a href="http://www.nicemood.net" target="_blank"><span>从这里可以进入我的首页！</span>网站首页</a></li>
<li><a href="http://www.nicemood.net" target="_blank"><span>这里边有一些英语和笑话！</span>英语笑话</a></li>
<li><a href="http://www.nicemood.net" target="_blank"><span>这里都是一些朋友的网站！</span>友情链接</a></li>
<li><a href="http://www.nicemood.net" target="_blank"><span>你要有什么要说的就来这！</span>给我留言</a></li>
<li><a href="http://www.nicemood.net" target="_blank"><span>是自已写的和收集的文章！</span>技术文章</a></li>
<li><a href="http://www.nicemood.net" target="_blank"><span>没有了都放在日记里面了！</span>生活照片</a></li>
</ul>
<div class="c"></div>
</div>
<div id="center">
</div>
</div>
</body>
</html>
----------------------------------------------------------------
11月11日
细线分隔线
程序代码
<hr noshade size=0 color=#C0C0C0>
程序代码
<hr width="长度" size="高度" color="颜色代码" noshade>
noshade为有无阴影
打开窗口即最大化
程序代码
<script language="JavaScript">
<!-- Begin
self.moveTo(0,0)
self.resizeTo(screen.availWidth,screen.availHeight)
// End -->
</script>
让垂直的滚动条隐藏
在<body> 或 <div>中加入style="overflow-y:hidden"即可
如：
<body style="overflow-y:hidden">
另外：<body style="overflow-x:hidden">可以隐藏横向滚动条
最简单的就<body scroll=no>就可以了
----------------------------------------------------------------
11月23日
CSS样式
a:link：表示已经链接；
a:hover：表示鼠标移上链接时；
a:active：表示链接激活时；
a:visited：表示己点击过的链接。
滚动条颜色代码
程序代码
BODY{
SCROLLBAR-FACE-COLOR: #FFFFFF;
SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF;
SCROLLBAR-SHADOW-COLOR: #FFFFFF;
SCROLLBAR-3DLIGHT-COLOR: #FFCBC8;
SCROLLBAR-ARROW-COLOR: #FFFFFF;
SCROLLBAR-TRACK-COLOR: #FFFFFF;
SCROLLBAR-DARKSHADOW-COLOR: #FFCBC8;
SCROLLBAR-BASE-COLOR: #FFFFFF
}
----------------------------------------------------------------
12月17日
嵌套DIV:父DIV的高度不能根据子DIV自动变化的解决方案
<div id="parent">
<div id="content"> </div>
</div>
当Content内容多时，即使parent设置了高度100%或auto,在不同浏览器下还是不能完好的自动伸展。 解决方案
<div id="parent">
<div id="content"></div>
<div style="font: 0px/0px sans-serif;clear: both;display: block"> </div>
</div>
在层的最下方产生一个高度为1的空格，可解除这个问题
本文来自 我爱贝贝[www.bbmy.net]-金东浩官方网站，如若转载注明出处。
金东浩博客随机日志
 剃头瞬间 |  给宝宝PS大头照 |  不如改个小名吧 |  小贝生活杂志创刊 |  关于小贝 |  小贝冲出照片之p |
 昨晚一夜未睡 |  宝宝鼻子不通，只 |  好吃的棒棒糖 |  骑电动马 |  圣诞快乐 |  小贝爱洗脚 |
 测试一下新做的f |  照相机当摄像机使 |  学步车上的小贝 |  可怜的小贝 |  小贝在家受折磨 |  小贝掉到地上了！ |
