转到正文

寂寞如浮云

李权辉的个人博客:人,终究是生活在现实之中,是为了活着而生活.

存档

分类: CSS

PNG图片为背景: 方法一:将png图片,输出一张gif图片,用css hack的方法,CSS定义如下: .ie6pngimg { background:url(img.png); _background:url(img.gif);} 方法二:使用Microsoft专有滤镜,CSS定义如下: #ie6pngimg{width:100%;background-image:url(img.png);_background:none;_filter: progid:DXImageTransform.M......

先有牛人用CSS3画了机器猫,然后另一位工程师用HTML5画了灰太狼,从一定程度上测试出主流浏览器对HTML5和CSS3的支持情况。 机器猫:http://www.liulan7.net/labs/css3.html 灰太狼:http://www.liulan7.net/labs/huitailang.html 测试代码下载,版权归原作者所有!

在使用<pre></pre>粘贴代码时,或者用<blockquote></blockquote>引用时,会发现pre/blockquote中的过长的代码,如过长的url等,在Opera/Firefox/Chrome不会实现自动换行。对于IE,可以通过IE专有的CSS属性word-wrap即可实现自动换行:word-wrap:break-word;,而对于Opera/Firefox/Chrome则不适用......

另外一种图片放大镜效果,在鼠标滑过缩略图时,原图放大显示: <style type="text/css"> .thumb{ position: relative; z-index: 0; } .thumb:hover{ background-color: transparent; z-index: 50; } .thumb span{ position: absolute; left: -1000px; background-color: #ffffcc; padding: 5px; bord......

因朋友网页改版后的页面内容少,要将footer层固定在整个页面的最下方,网页的内容比较少时,页脚的联系方式部分不随着页面中的内容高度的减小而上移。这种方式适用于将网页中的版权信息固定在页面下方。当然,当页面内容多时,页脚也要正常显示。 这就要用到CSS的4大核心基石:盒子模型、标准流、浮动、定位。只有把这些......

ul是html中的无序列表,li是列表中的列表项。如果没有CSS定义它的外观,它默认是显示成一列列表,并且它会存在项目符号(比如方块或实心的黑点)的列表内容。 在CSS网页布局中,我们通常用ul、li来实现横向导航菜单。这就是要我们自己定义CSS来改变它的外观,使它能横向显示在在一行中,并且将项目符号去掉。 CSS: * ......

为了增加页面的美观效果,有时需要将div层或表格的边角进行圆角处理。下面介绍一个老外用CSS写的实例: CSS: /*注意CSS标签之间的嵌套*/ body{padding: 20px;background-color: #FFF;  font: 100.01% "Trebuchet MS",Verdana,Arial,sans-serif;} h1,h2,p{margin: 0 10px;} h1{font-size: 250%;color: #FFF;} h......

CSS缩写

6月 4

  Web网站可用性的关键指标是速度,影响速度的因素有很多种,包括Web服务器的速度、访问者的Internet连接情况,以及浏览器必须下载的文件大小等等,尽管你无法控制服务器和连接的速度,但是你可以控制构成网站Web页面的文件大小。   为了让网站能够更快,Web的建设者都会按常规地压缩和优化网站上的每一个图像文件,......

  1、不要使用过小的图片做背景平铺。因为宽高1px的图片平铺出一个宽高200px的区域,需要200*200=40,000次,这就是为何很多人都不用1px的原因,占用资源。   2、无边框的推荐写法是border:none;,而border:0;只是定义边框宽度为零,但边框样式、颜色还是会被浏览器解析。   3、慎用*通配符。所谓通配符,就是将CSS......

div层叠

5月 20

  首先要明确在文中所需要用到的几个自定义概念:   1、静态定位:position:static(为position属性的默认值)。   2、动态定位:position:relative或position:absolute或position:fixed。   3、祖元素:任意包含该元素的元素。   4、父元素:直接包含该元素的祖元素。   5、同辈元素:拥有共同的父元素的元......

  CSS为定位和浮动提供了一些属性(position static relative absolute float z-index),利用这些属性,可以建立列式布局,将布局的一部分与另一部分重叠,还可以完成多年来通常需要使用多个表格才能完成的任务。它允许你定义元素框相对于其正常位置应该出现的位置,或者相对于父元素、另一个元素甚至浏览器窗口本身的......