Jul
2009
31
13:28
CSS公用文件,由于各浏览器的默认CSS样式不一样，我们必须写一个CSSReset统一起来。通常我的做法是在common.css里写全局控制，这里面也包括header和footer，其它CSS文件就通过@importurl”common.css”;引用。body{padding:10px;margin:0;background:#fff;font-size:12px;line-heigh..
Jul
2009
31
13:28
门户网站与大型网站的CSS架构与组织,对于大型门户，海量信息平台及多模块，多区域化网站，更需要对CSS，XHTML的标准化，符合语意的HTML框架，复用性强的CSS代码，这些才能保障你的网站，具有很好的“地基”。第一部：关于构建CSS框架我们要实现的目的：1.实现标准化，具备主流平台适应性的前端实现；2.快速..
Jul
2009
31
13:28
IE的IF条件注释使用备忘,在CSS布局中，还常常用到IEHack。ifIE起着非常大的作用！ifIE什么意思呢？下面就列举了一些在CSS常见的HACK控制语句。作为IE的IF条件注释使用备忘，有些时候试用ifIE而不是在css中使用hack，就能通过w3c验证。lt;!--[if!IE]gt;除IE外都可识别lt;![endif]--gt;lt;!--[if..
Jul
2009
31
13:28
巧用CSS制作特效艺术字7例,1.blur滤镜效果:代码如下：nbsp;lt;TABLEheight=50width=100%align=centerborder=0gt;lt;TBODYgt;lt;TRgt;lt;TDstyle=FILTER:blurdirection=135,strength=8align=middlegt;lt;FONTface=黑体color=#8c96b5size=6gt;lt;Bgt;lt;Igt;欢迎光临互联友吧的博客！lt;/Igt;lt;/B..
Jul
2009
31
13:28
css彩色虚线表格及JS鼠标指向单元格变色制作方法,在我们制作主页的过程中，用到表格的地方非常多，灵活运用表格技巧可以为我们的网页增色不少，这里我就详细介绍CSS彩色虚线表格及JS鼠标指向单元格变色制作方法一、CSS彩色虚线表格lt;styletype=text/cssgt;lt;!--.tab1{border-top-width:thin;border-right-width:thin..
Jul
2009
31
13:28
挺不错的CSS颜色搭配,来源于网络，留着以后用，共19个。#EFF7FF#96C2F1#F0FBEB#9BDF70#FFFFFF#92B0DD#EEFAFF#BBE1F1#FAFCFD#CCEFF5#FFFFF7#FFCC00#E8F5FE#A9C9E2#FFFFDD#E3E197#F2FDDB#ADCD3C#FFF5FA#F8B3D0#F7F7F7#D3D3D3#F3FAFF#BFD1EB#FFF9ED#FFDD99#F7F7FF#CACAFF#EEF3F7#A5B6C8#F1F7F9..
Jul
2009
31
13:28
CSSSprites图片切割术与图片优化,关于CSSSprites技术的优化我们能做到多少，能减多少的请求数量。这并且不是单方面能做到的，一切取决于XHTML、CSS、CSSSprites图片之间的配合。现时为止没有绝对优化的做法，这也是我在项目中经常衡量CSSSprites图片与XHTML关系，如:《一张背景实现自适应九宫格》，以下..
Jul
2009
31
13:28
CSS中跨浏览器的inline-block实现,nbsp;nbsp;nbsp;我们在制作网页时，有时会希望一个元素既能像block一样定义宽度和高度，又可以像普通的inline一样不断行。例如下面这张图片中红线标出的地方：nbsp;nbsp;nbsp;通常我们实现这样的效果会使用这样的代码：lt;ahref=”#”gt;lt;imgsrc=”….”alt=”….”/..
Jul
2009
31
13:28
DIV+CSS与XHTML+CSS是什么意思?,不知道从什么时候开始，在网络上到处可以看到div+css，到底什么是div+css呢？难道就是传说中的标准重构吗？标准从最简单的根源来说不是合理使用xhtml的标签吗？可为什么还是有这么多div+css呢？既然可以div+css，那为什么不可以叫span+cssul+cssli+css等等呢？疑问，满..
Jul
2009
31
13:28
跨浏览器的inline-block实现[CSS],最近在为自己做个新站，想到了些效果，实现时碰到了些小麻烦，比如这个inlineblock。所幸大多数问题都解决了，所以写出来分享一下。我们在制作网页时，有时会希望一个元素既能像block一样定义宽度和高度，又可以像普通的inline一样不断行。例如下面这张图片中红线标出的..
Jul
2009
31
13:28
CSS中的Position属性,CSS的Position很重要，有以下几个值：static，relative，absolute，fixed。Static：静态定位。如果你没有设置position属性，那么缺省就是static。top，left，bottom，right等属性，在static的情况下是无效的，要使用这些属性，必须把position设置为其他三个值之一。Rel..
Jul
2009
31
13:28
CSS布局常用的方法,float:none|left|right取值：none:?默认值。对象不飘浮left:?文本流向对象的右边right:?文本流向对象的左边它是怎样工作的，看个一行两列的例子xhtml代码:nbsp;ExampleSourceCode[www.devdao.com]lt;divid=wrapgt;lt;divid=column1gt;这里是第一列lt;/divgt;lt;divi..
Jul
2009
31
13:28
Javascript+css实现网页换肤功能,Html代码部分:1.要有一个带id的样式表链接,我们要通过操作这个链接来调用不同的href.lt;linkhref=csmain0.cssrel=stylesheettype=text/cssid=cssfile/gt;2.皮肤选择按钮后台为每个li添加onclick事件,触发换肤功能lt;ulid=skingt;lt;liid=skin_0title=灰色gt;灰色lt;/li..
Jul
2009
31
13:28
CSS样式文件优化更整洁而清晰,CSS简写就是指将多行的CSS属性声明化成一行，又称为CSS代码优化。CSS简写的最大好处就是能够显著减少CSS文件的大小，其实还有很多其他益处。臃肿而杂乱的CSS样式表会使你遇到问题是难以调试。尤其是当一个团队在进行设计的时候，你的臃肿的CSS代码会使你的团队其他成员..
Jul
2009
31
13:28
用CSS写的星级评分,利用层的定位、层的顺序以及背景定位来实现的星级评分。HTML部分：lt;h1gt;CSS:StarRatingReduxlt;/h1gt;lt;ulclass=star-ratinggt;lt;liclass=current-ratingstyle=width:60%;gt;Currently3/5Stars.lt;/ligt;lt;ligt;lt;ahref=#title=1staroutof5class=one-stargt;1lt..
Jul
2009
31
13:28
解决浏览器的等宽空格CSS问题方法,很多时候，希望能够在HTML中使用空格排版。但浏览器在解析HTML时，会把连续的空格解析成一个，所以我们会使用amp;nbsp;等这样的占位符。但是amp;nbsp;也不是很可靠，比如空格间距非常大，那么我们必须增加多个占位符，同时页面的体积会变得非常大。同时，注意到Safari中..
Jul
2009
31
13:28
实例学习CSS网页技术基本语法,1.基本语法CSS的定义是由三个部分构成：选择符（selector），属性（properties）和属性的取值（value）。基本格式如下：selector{property:value}nbsp;（选择符{属性：值}）选择符是可以是多种形式，一般是你要定义样式的HTML标记，例如BODY、P、TABLE……，你可以通过..
Jul
2009
31
13:28
CSS技巧整理共25条,1、ul标签在Mozilla中默认是有padding值的，而在IE中只有margin有值。2、同一个的class选择符可以在一个文档中重复出现，而id选择符却只能出现一次；对一个标签同时使用class和id进行CSS定义，如果定义有重复，id选择符做的定义有效，是因为ID的权值要比CLASS大。3、一..
Jul
2009
31
13:28
CSS对页面文字链接的设置大全,如何使有超级链接的文字不出现下划线？如何使鼠标移动到超连上产生变色的效果？如何使鼠标移动到超连上产生文字大小变化的效果？如何使访问过的链接变成不同的颜色？......这些问题经常会困扰刚做网页的网友，其实这些问题解决起来是非常简单的，使用CSS的控制就可以非..
Jul
2009
31
13:28
cssdiv+spanpadding的使用,今天开Money的空间有个小游戏就玩了下，考察了一些基本知识，发现我不会的还真不少源代码如下lt;htmlgt;lt;stylegt;#tabulli{list-style:none;float:left;padding:5px15px5px15px;}#tabdiv{clear:both;}lt;/stylegt;lt;bodygt;lt;scriptgt;functionsetspanid{ifid==1{a..
Jul
2009
31
13:28
CSS中权重的例子,CSS2.1中使用一个4位的数字来表示权重，以下是有关权重的一些规定:类型选择符的权重为：0001类选择符的权重为：0010通用选择符的权重为：0000子选择符的权重为：0000属性选择符的权重为：0010伪类选择符的权重为：0010伪元素选择符的权重为：0010包含选择符的权重为：包..
Jul
2009
31
13:28
CSS定高多行垂直居中,用Table布局可以很容易的实现文字和图片的垂直居中，但是在div的布局中呢，要实现定高容器里面的内容的垂直居中不是太简单的事情。在DOM标准中在IE中综合#boxOuter{nbsp;nbsp;nbsp;display:table;nbsp;nbsp;nbsp;height:300px;nbsp;nbsp;nbsp;width:500px;nbsp;nbsp;nb..
Jul
2009
31
13:28
文字超出显示省略号==CSS制作,文字超出显示省略号，大家可以复制这段代码进行实验下lt;htmlgt;lt;headgt;lt;styletype=text/cssgt;#cs{width:100px;height:50px;line-height:50px;color:#6699ff;border:1px#ff8000dashed;overflow:hidden;text-overflow:ellipsis}lt;/stylegt;lt;/headgt;lt;bodygt;..
Jul
2009
31
13:28
使用CSS设置表格,HTML代码：lt;bodygt;nbsp;nbsp;nbsp;lt;tableclass=tableListwidth=600cellspacing=0gt;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;lt;captiongt;江山代有才人出各领风骚数百年lt;/captiongt;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;lt;theadgt;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;..
Jul
2009
31
13:28
根据时间段自动切换CSS风格,我们的博客或者网站总用一个css会造成审美疲劳的，那么我们就想个办法让它自己换好了，以前有很多随机变换css的代码，我就不发了，今天来一个新鲜点的，嘿嘿~我们可以让我们的博客或者网站根据当前的时间自动更换风格，比如我们制作两套css，一套上午用，一套下午用。这..
Jul
2009
31
13:28
外部引用CSS中link与@import的区别,这两天刚写完XHTML加载CSS的几种方式，其中外部引用CSS分为两种方式link和@import。本质上，这两种方式都是为了加载CSS文件，但还是存在着细微的差别。差别1：老祖宗的差别。link属于XHTML标签，而@import完全是CSS提供的一种方式。link标签除了可以加载CSS外，还可以做..
Jul
2009
31
13:28
CSS+js放大镜,lt;headgt;nbsp;nbsp;nbsp;lt;titlegt;CSSFisheyelt;/titlegt;nbsp;nbsp;nbsp;lt;styletype=text/cssgt;nbsp;nbsp;nbsp;span{font-size:x-small}nbsp;nbsp;nbsp;lt;/stylegt;nbsp;nbsp;nbsp;lt;scriptlanguage=JavaScripttype=text/javascriptgt;nbsp;nbsp;nb
Jul
2009
31
13:28
css层固定位置练习,lt;!DOCTYPEhtmlPUBLIC-//W3C//DTDXHTML1.0Transitional//ENnbsp;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtdgt;lt;htmlxmlns=http://www.w3.org/1999/xhtmlgt;lt;headgt;lt;metahttp-equiv=Content-Typecontent=text/html;charset=utf-8/gt;l
Jul
2009
31
13:27
css修正Input标签在各种浏览器中差异,首先，说明一下表单标签（input、select）可能在各种浏览器中的表现差异：1.当input或select与其他标签（例如a、label）混排时，可能出现不居中的问题。2....混排时，外层标签不能控制表单标签。3.input里面输入的文字行高存在差别，有空隙等等。解析现象：input：text..
Jul
2009
31
13:27
CSS实现未知高度图文混合垂直居中,IE6,IE7,FF3测试通过CSS*{margin:0;padding:0;list-style:none;nbsp;}nbsp;#vertical_box{width:100%;display:table;border:1pxredsolid;height:400px;/*针对IE的hack*/*position:relative;}#vertical_box_sub{display:table-cell;vertical-align:middle;/*针
