随笔分类 -  CSS

css-圆角（带注释)
摘要：圆角注释/***这个圆角的思路在于，用缩小化的视觉感受体现的,其实每一个弯角是用两个像素的"-"与一个像素的"."与两个像素的"|"实现的.*b1与b1b相对，通过背景来制作边框*b2与b2b相对，通过border-width:2px制作2个像素的"-"*b3与b3b相对，制作1个像素的"."*b4与b4b相对，制作2个像素的"|"这样就从视觉上感觉是一个圆弧了。*//*确定为block，为了让左右边框实现*/.b1,.b2,.b3,.b4,.b1b,.b2b,.b3b,.b 阅读全文

posted @ 2011-11-10 16:09 帘 阅读(410) 评论(0) 推荐(0)

css-文本垂直居中(转)
摘要：Normal 0 7.8 磅 0 2 false false false EN-US ZH-CN X-NONE 在说到这个问题的时候，也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗？即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊！所以在这里我还要啰嗦两句，CSS中的确是有vertical-align属性，但是它只对(X)HTML元素中拥有valign特性的元素才生效，例如表格元素中的<td>、<th>、<caption>等，而像<div>、<span>这样的元素是没有valign特性的， 阅读全文

posted @ 2011-08-17 09:18 帘 阅读(27162) 评论(0) 推荐(1)

css-ie 3px
摘要：DIV浮动IE文本出现3px间距的bug发生场合：当左边对象是浮动的，右边对象采用外补丁的左边距来定位，则右边对象内的文本会离左边有3px的空白误差。没加修正：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang 阅读全文

posted @ 2011-08-12 08:18 帘 阅读(337) 评论(0) 推荐(0)

css-进度条
摘要：<!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- 阅读全文

posted @ 2011-08-09 18:13 帘 阅读(1205) 评论(0) 推荐(0)

css-折叠标签
摘要：<ul id="menu"> <li><a href="#"><h1>CSS是什么</h1> <span>不知道</span></a></li> <li><a href="#"><h1>HTML是什么</h1> <span>也不知道</span></a> <li><a href="#"><h1&g 阅读全文

posted @ 2011-08-08 23:44 帘 阅读(1416) 评论(1) 推荐(0)

css-图像地图
摘要：<div id="ImageMap"> <a href="#" class="tip" id="c1"> <span class="popbox">图片的评论1</span> </a> <a href="#" class="tip" id="c2"> <span class="popbox" >图片的评论2</span> 阅读全文

posted @ 2011-08-08 23:10 帘 阅读(225) 评论(0) 推荐(0)

css-提示消息
摘要：<a href="#" class="tip">CSS<span class="popbox">Cascading sytle sheets 层叠样式表</span></a>a.tip{ color:red; text-decoration:none; position:relative;}a.tip span{display:none};a.tip:hover{cursor:hand;}a.tip:hover .popbox { display:block; position:abso 阅读全文

posted @ 2011-08-08 22:50 帘 阅读(2167) 评论(0) 推荐(0)

css-右侧导航
摘要：<!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- 阅读全文

posted @ 2011-08-07 21:53 帘 阅读(1331) 评论(0) 推荐(0)

css-纵向导航
摘要：<!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- 阅读全文

posted @ 2011-08-07 21:22 帘 阅读(851) 评论(0) 推荐(0)

css-横向导航
摘要：<!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- 阅读全文

posted @ 2011-08-07 21:05 帘 阅读(2049) 评论(0) 推荐(0)

css-高度自适应的问题
摘要：对象height:100%并不能直接产生效果，是因为跟其父对象有关。#center{height:100%;}上面的css样式是无效的，不会产生任何效果。需要改写：html,body{ margin:0px; height:100%;}#center{width:200px;height:100%;background-color:#666666;border:1px solid red;}对#center对象设置了height:100%,同时设置了html与body的height：100%，这就是高度自适应的问题所在，一个对象的高度是否可以使用百分之比显示，取决于对象的父类对象，在页面中，# 阅读全文

posted @ 2011-08-07 10:37 帘 阅读(22622) 评论(1) 推荐(2)

导航