方法一： /* CSS Document */ body,html{ margin:0px; padding:0px; text-align:center; background:#e9fbff; } #container{ position:relative; margin:0px; padding:0px; width:700px; /*必须要有宽度否则无法对齐*/ text-align:left; background:url(container_bg.jpg) repeat-y; } 方法二： /* CSS Document */ body,html{ margin:0px; padding:0px; background:#e9fbff; } #container{ position:relative; left...
表格边框间距属性(border-sapcing)用来定义表格中独立边框之间的间距。在表格边框间距属性中，使用的属性值是长度值。其语法如下所示。border-spacing：length;****************************************************************注意：当在表格边框合并属性中使用合并显示值(collapse)的时候，使用表格边框间距属性将不起作用。IE浏览器并不支持表格边框间距属性，只有在Firefox等浏览器中，才能够显示出间距的正常效果。********...
把分割线之后的代码复制到dreamweaver新建一个html文件,在“代码”视图保存，预览可见效果，注意CSS的设置 -----------------------------------我是超级分割线----------------------------------- 代码： 无标题文档#header { background-color: #00FFFF; height: 120px; width: 800px; margin-right: auto; margin-left: auto;}#body { width: 800px; margin-right: auto; margin-left: auto;}#body #right { background-col...
在CSS中，实现分栏布局有两种方法。第一种方法是使用四种CSS定位选项（absolute 、static、relative和fixed）中的绝对定位（absolute positioning），它可以将文档中的某个元素从其原本位置上移除，并重新定位在期望的任何地点之上。第二种则是使用CSS中的浮动（float）概念。 绝对定位或浮动都能够用来实现分栏效果。二者可以独立使用，也可以结合在一起，相辅相成。 一、绝对定位 绝对定位的优势在于，我们可以...
1、不要使用过小的图片做背景平铺。这就是为何很多人都不用 1px 的原因，这才知晓。宽高 1px 的图片平铺出一个宽高 200px 的区域，需要 200*200=40, 000 次，占用资源。 2、无边框。推荐的写法是 border:none;，哈哈，我一直在用这个。 border:0; 只是定义边框宽度为零，但边框样式、颜色还是会被浏览器解析，占用资源。 3、慎用 * 通配符。所谓通配符，就是将 CSS 中的所有标签均初始化，不管用的不用的，过时的先进的，一视同仁，...
按照CSS规范，浮动元素（float）会被移出文档流，不会影响到块状盒子的布局而只会影响内联盒子（通常是文本）的排列。因此当其高度超出包含容器时，一般父容器不会自动伸长以闭合浮动元素。但是有时我们却需要这种自动闭合行为，具体如何处理呢？ 有一种做法就是在父容器内再插入一个额外的标签，并令其清除浮动（clear）以撑大父容器。这种方法浏览器兼容性好，没有什么问题，缺点就是需要额外的（而且通常是无语义的）标签...
1、 常见实用的水平导航条 新建一个html文件： 代码： 常用水平导航制作方式 #globallink{ margin:0px; padding:0px; /*边界、填充均为0*/ clear:both; /*清除浮动*/ } #globallink ul{ list-style:none; /*不显示列表图象，默认实心圆等*/ padding:0px; margin:0px; dis...
1.第一种，鼠标经过的跟随信息显示： < html > < style > ... .info {...}{ position:relative; background:#fff; color:#666; text-decoration:none; font-size:12px; width:150px; text-align:center; border:1px solid #ccc; height:25px; line-height:25px;}/**//*设置链接的...
Div + CSS Example, Wayhome's Blog #wrap{overflow:hidden;} #sidebar_left,#sidebar_right{padding-bottom:100000px;margin-bottom:-100000px;} Left Middle Middle Middle Middle Middle Middle Middle Middle Middle Right
实现代码: < style type ="text/css" > #sfContainer1 { font : bold 10pt simsun, tahoma ; background-color : #808080 ; height : 30px ; line-height : 30px ; padding-left : 20px ; } #sfFrontText { color : #FFFFFF ; position : absolute ; padding : 0px ; z-index : 1 ; } #sfBackText { ...
1.区别IE和非IE浏览器 #tip { background : blue ; /*非IE 背景?色 */ background : red \9 ; /* IE6、IE7、IE8背景?色 */ } 2.区别IE6,IE7,IE8,FF 【区别符号】：「\9」、「*」、「_」 【示例】： #tip { background : blue ; /* Firefox 背景变蓝色 */ background : red \9 ; /* IE8 背景变红色 */ *background : black ; /* IE7 背景变黑色 */ _background :...
第一天 XHTML CSS基础知识 http://www.aa25.cn/div_css/902.shtml 1.整个盒模型在页面中所占的宽度是由左边界+左边框+左填充+内容+右填充+右边框+右边界组成，而css样式中width所定义的宽度仅仅是内容部分的宽度。 第二天 一列布局 http://www.aa25.cn/div_css/903.shtml 1. css手册中说：块级元素的垂直相邻外边距会合并，而行内元素实际上不占上下外边距。行内元素的的左右外边距不会合并。同样地，浮动元素的外边距也不...
脚本控制三行三列自适应高度DIV布局 function P7_colH(){ var i,oh,hh,h=0,dA=document.p7eqc,an=document.p7eqa; if(dA&&dA.length){ for(i=0;i dA[i].style.height='auto'; } for(i=0;i oh=dA[i].offsetHeight;h=(oh>h)?oh:h; } for(i=0;i if(an){ dA[i].style.height=h+'px'; }else{ P7_eqA(dA[i].id,dA[i].offsetHeight,h); } } if(an){ for(i=0;i hh=dA[i...
这种技巧的名称叫做CSS Sprite，基本原理就是利用CSS中图片background系列的 background-image、background-repeat、background-position等属性实现。通过这种方式达到图片显示 加速的关键，不是降低重量，而是减少个数。在通常情况下一张图片的传输时间，通常远小于请求等待的时间。 PS：特别制作了三个CSS Sprites实例演示，感兴趣的朋友可以看一看。 实例 比如google.cn现在首页的底部导航也是用这个方式实现的。 所用图片...
代码如下： Code 无标题文档 .scroll_div { width:660px; height:146px; margin:0 auto; overflow: hidden; white-space: nowrap; background:#ffffff; margin-left:-6px; } .scroll_div img { width:128px; height:140px; border: 0; margin: auto 2px; border:3px #ccc solid; } #scroll_begin, #scroll_end, #scroll_begin ul, #scroll_end ul, #scroll_begin ul l...