寂寞@牵

导航

2011年11月7日

固定宽度布局的列背景色设置

摘要: 效果图:<title>固定宽度布局的列背景色设置</title><style type="text/css">#head,#content,#bottom{margin:0px;padding:0px;width:900px;margin:0px auto;}#head{height:100px;background:#666;}#content{position:relative;height:400px;}#left{background:#FF0;text-indent:2em;width:200px;margin:0px;padd 阅读全文

posted @ 2011-11-07 11:14 魔魅般的蓝眼 阅读(166) 评论(0) 推荐(0) 编辑

2011年11月4日

1-3-1左右动态中间固定的布局

摘要: <title>1-3-1左右动态中间固定的布局</title><style type="text/css">#header,#content,#footer{background-color:#ccc;border:1px solid #0ca;height:30px;width:80%;margin:10px auto;}#content{height:500px;}#left{height:500px;background-color:#0F0;border:1px solid red;margin-left:104px;}#midd 阅读全文

posted @ 2011-11-04 13:19 魔魅般的蓝眼 阅读(72) 评论(0) 推荐(0) 编辑

1-3-1左右固定中间动态的布局

摘要: <title>1-3-1左右固定中间动态的布局</title><style type="text/css">#header,#content,#footer{background-color:#ccc;border:1px solid #0ca;height:30px;width:100%;margin:10px auto;}#content{height:500px;}#left{width:100px;height:500px;float:left;background-color:#0F0;border:1px solid red; 阅读全文

posted @ 2011-11-04 13:18 魔魅般的蓝眼 阅读(113) 评论(0) 推荐(0) 编辑

1-3-1布局

摘要: <title>1-3-1布局</title><style type="text/css">#header,#content,#footer{background-color:#ccc;border:1px solid #0ca;height:30px;width:800px;margin:10px auto;}#content{height:500px;}#left{height:500px;width:200px;float:left;background-color:#0F0;border:1px solid red;}#midd{f 阅读全文

posted @ 2011-11-04 13:14 魔魅般的蓝眼 阅读(113) 评论(0) 推荐(0) 编辑

2011年10月28日

带箭头加提示信息的菜单列表

摘要: <title>带箭头加提示信息的菜单列表</title><style>body{background-color:#999;}#menu{font-size:16px;width:140px;margin:0 auto;border:solid 1px #ccc;}#menu a,#menu a:visited{text-decoration:none;text-align:center;color:#c00;display:block;padding:4px;background-color:#fff;border:solid 1px #ff;height 阅读全文

posted @ 2011-10-28 12:46 魔魅般的蓝眼 阅读(130) 评论(0) 推荐(0) 编辑

双斜线菜单

摘要: <title>无标题文档</title><style type="text/css">#menu{width:9em;margin:0px auto;font-family:Arial, Helvetica, sans-serif;font-size:14px;border:solid #aaa 1px;}#menu a,#menu a:visited{display:block;text-decoration:none;color:#000;line-height:1.4em;border:0.5em solid #fff;}#menu 阅读全文

posted @ 2011-10-28 12:44 魔魅般的蓝眼 阅读(141) 评论(0) 推荐(0) 编辑

双横线菜单

摘要: <title>无标题文档</title><style>#menu{font-family:Arial, Helvetica, sans-serif;font-size:14px;margin:auto;}#menu a,#menu a:visited{background-color:#fff;padding:1px 4px;color:#000;text-decoration:none;border-top:8px solid #9ab;border-bottom:8px solid #9ab;white-space:nowrap;}#menu a:hov 阅读全文

posted @ 2011-10-28 12:42 魔魅般的蓝眼 阅读(120) 评论(0) 推荐(0) 编辑

立体菜单

摘要: <title>立体菜单</title><style type="text/css">#menu{font-family:Arial, Helvetica, sans-serif;font-size:14px;}#menu a ,#menu a:visited{text-decoration:none;text-align:center;color:#fff;display:block;width:10em;padding:0.25em;margin:0.5em auto;background-color:#8ab;border:2px s 阅读全文

posted @ 2011-10-28 12:30 魔魅般的蓝眼 阅读(140) 评论(0) 推荐(0) 编辑

左上角缺部分的菜单

摘要: <title>无标题文档</title><style>.item{font-family:Arial, Helvetica, sans-serif;font-size:16px;background:#ccc;list-style-type:none;float:left;padding-bottom:5px;}.item li{float:left;padding:5px;margin:5px;}.item li a,.item li a:visited{color:#fff;text-decoration:none;font-weight:bold;po 阅读全文

posted @ 2011-10-28 12:24 魔魅般的蓝眼 阅读(76) 评论(0) 推荐(0) 编辑

带箭头的菜单列表

摘要: <title>带箭头的菜单列表</title><style>body{background-color:#999;}#menu{font-size:16px;width:140px;margin:0 auto;border:solid 1px #ccc;}#menu a,#menu a:visited{text-decoration:none;text-align:center;color:#c00;display:block;padding:4px;background-color:#fff;border:solid 1px #ff;height:1em; 阅读全文

posted @ 2011-10-28 12:19 魔魅般的蓝眼 阅读(146) 评论(0) 推荐(0) 编辑