如果你想成为一位CSS专家的话，光背出一堆选择器是不够的，还要能够提高CSS样式表的可读性，开发效率以及维护性。这里，JinaBolton将给我们分享一下她关于如何创建性感的CSS样式表的十个技巧。本文主要内容为：CSS代码编码规范，教你如何写出整洁漂亮性感的css代码，如何清晰的组织你的样式表文件。闲言少叙，直接进入...

[阅读全文]

class是设置标签的类id是设置标签的标识class属性用于指定元素属于何种样式的类。如样式表可以加入.baobao{color:lime;background:#ff80c0}使用方法：class="baobao"id属性用于定义一个元素的独特的样式。如一个CSS规则#binbin{font-size:larger...

[阅读全文]

CSS学习越深入，我们需要关注的细节之处就越多，今天我们通过11个注意点来提高CSS的网页渲染效率。　　1、十六进制的颜色值对位数与大小写　　编写十六进制颜色值时你可能会用小写字母或省略成3位数，关于这写法没找到确实的数据证明对浏览器的渲染效率是否有影响，但十六进制的颜色值默认标准是大写及6位数标注。在未知情况下不希望...

[阅读全文]

当前古典竖排文字大行其道，广受欢迎，其实实现这一效果非常简单，我们使用CSS就能实现。<DIVstyle="WRITING-MODE:tb-rl;TEXT-ALIGN:left"><DIVstyle="LINE-HEIGHT:1.5em;LETTER-SPACING:0.2em;">学而时习之,不亦说乎?有朋自远方来,...

[阅读全文]

原文：http://jorux.com/archives/property-4-if-you-love-css/本文作为属性篇的最后一篇文章,将讲述HTML和CSS的关键—盒子模型(Boxmodel).理解Boxmodel的关键便是margin和padding属性,而正确理解这两个属性也是学习用css布局的...

[阅读全文]

原文：http://www.planabc.net/2008/07/24/legend_width/我们在做表单的时候经常会使用到这样的结构：<fieldset><legend>哪些浏览器legend标签设定的宽度有效</legend><inputtype="checkbox"value="ie6"name="widt...

[阅读全文]

　浏览器显示页面是一行一行的按顺序执行代码，也就是说写在前面的先执行显示，而对于左中右3栏布局的设计，代码要么是从左-->中-->右来书写，要么就是到过来从右-->中-->左来书写，要做到要求的效果，那首先要书写的是中栏的代码。　　所以我首先定义了一个id=m的DIV，并且padding-left:150px，定义这个...

[阅读全文]

　我想把本篇作为css基础教程的序曲，从今天开始翻译和整理我从设计网页以来所学到的css基础知识。本教程会分成N个部分，单独发表，其间可能会插入几篇与教程无关的文章。没有具体的教程发表进度,推荐关注本教程的朋友订阅本站Feed。教程内容的30%-50%为Jorux原创，其余翻译部分均为意译,可能来源于多个国外站点，并在...

[阅读全文]

用法：<divid="test"><spanstyle="color:red">test1</span>test2</div>在JS中可以使用：test.innerHTML:　　也就是从对象的起始位置到终止位置的全部内容,包括Html标签。　　上例中的test.innerHTML的值也就是“<spansty...

[阅读全文]

　在CSS网页布局开发中，会有很多小技巧，新手朋友往往对此很不熟悉。在某一两个小问题上，或许纠缠很长时间才能搞明白，虽然在webjx.com的文档中，多次提及过这方面的内容，但依然有很多朋友在这些问题上犯错。我们今天看看这些CSS技巧，认真读一读，或许您并不能完全理解，您可以在webjx.com进行搜索，扩展您所想要得...

[阅读全文]

　CSSframework可以更快速、有效、可扩展的去书写站点的CSS代码。在webjx.com以前的文章中，我们有过多篇此类知识的介绍，以下是个某个知名团队在日常开发中的思考与总结，可能您会提出一些不同的观点，没关系，欢迎发表评论，和webjx.com的众多CSSer一起探讨吧！一、CSS框架　　中国的互联网行业已经...

[阅读全文]

CSSbug是布局中最头疼的问题。我们需要兼顾各种浏览器，以期待获得一致的效果。非常遗憾的是各厂商之间的竞争导致很多问题的存在。而IE6与IE7在很多问题上也存在着很大的差别。在webjx.com大量的技术文档中，也包含了这方面的内容。轻松的解决CSSbug是我们必须掌握的技能。现在整理出最常用的12种CSSBUG解决...

[阅读全文]

以前我们面对这些有着顺序或是有数字注明排序的内容时大多是在数据前自行加上一个数值，或是由程序加上这个数值。而如果使用有序列表则不需要这么麻烦，根本不用自行去填写序数，当单层列表的时候这种特性似乎并不明显，而当使用多层的时候其特性就很明显了。那么还是先来了解一下有序列表的代码形式：<ol><li>这就是列表的内容了，这是...

[阅读全文]

1.--栏目文章列表内容间隔颜色的定义--　　方法一（雅虎提供）：如果是默认的，即不需要改函数式标签GetArticleList中的参数，可以用CSS来定义（在后台风格中修改）：　　.listbg/*--栏目文章列表内容间隔颜色的定义1--*/　　{　　background:#ffffff;border-bottom:...

[阅读全文]

实现鼠标经过背景变色的方法有很多，今天我们介绍的是用CSS+DIV实现的方法。方法一#div:hover{background:#000000;}解释:鼠标经过id为div的元素时背景变色IE6.0、Firefox2.0、Opera9.23都不行方法二<divonmouseover="this.style.backgr...

[阅读全文]

为了节省字节，我建议不要给背景图片路径加引号，因为引号不是必须的。例如：background:url(images/***.gif)＃333;可以写为background:url(images/***.gif)＃333;如果你加了引号，反而会引起一些浏览器的错误。十一.组选择器(Groupselectors)当一些元素...

[阅读全文]

滑动门(SlidingDoors)还是决定把滑动门单独提作一种单独的技术.它是CSS引入的一项用来创造漂亮且实用的界面的新技术,它使用简单,我们只需要使用两张单独的背景图片,就可以实现。滑动门一般用做网站Tab导航,根据Tab中内容的长短自动缩放Tab的效果.前面所述的圆角矩形只是它的一种实现方式而已.真正的滑动门只需...

[阅读全文]

xhtml+css页面制作过程中问题的解决方案，说是解决方案应该有点过了，充其量只不过是给刚刚开始学标准页面制作的朋友们的一些小建议，如果讲得不对的地方请多多包涵，当然也可以提出你们更好的方法，大家相互学习交流，共同成长！无论是谁，在制作页面的过程都是会碰到这样或者那样的问题，出了问题就肯定要解决。解决问题的前提是要知...

[阅读全文]

互联网上不计其数的信息本质上都是一个一个的HTML文档组成的，通过链接将它们串联起整个互联网。这就犹如骨肉之于人体一样，只有通过经脉才能将它们串联起来，组成一个完整的人体。看似最基本的一个<a/>标签，却是HTML文档中至关重要不可或缺的一个标签。这个<a/>标签是页面之间链接的一个纽带，起着一个桥梁的作用。这座桥梁在...

[阅读全文]

CSS对浏览器器的兼容性具有很高的价值，通常情况下IE和Firefox存在很大的解析差异，这里介绍一下兼容要点。常见兼容问题：1.DOCTYPE影响CSS处理2.FF:div设置margin-left,margin-right为auto时已经居中,IE不行3.FF:body设置text-align时,div需要设置ma...

[阅读全文]

虽然CSS样式的学习需要我们动手多实践，需要多做案例，思致思考，但有时候注意资料的收集与整理也是非常重要的，在实际开发中往往会起到事半功倍的效果。一、按钮样式ExampleSourceCode.buttoncss{font-family:"tahoma","宋体";font-size:9pt;color:#003399...

[阅读全文]

cssfile:input{behavior:url(bindbutton.htc);}htcfile:<PUBLIC:COMPONENTlightWeight=true><PUBLIC:ATTACHEVENT="oncontentready"ONEVENT="load()"/><PUBLIC:ATTACHEVENT=...

[阅读全文]

有序无序单标签很简单，只要知道用法就行，但是关键点我认为不在于知道这个标签长什么样，重点是在于什么样的数据适合使用什么样的列表。什么样的数据是有序的，什么样的数据是无序的？阅读完要思考，这样才能学到东西，知识才能是自己的。定义列表其形式特别，用法也很特别，相比较无序列表来说用到定义列表的就少很多。也有很多朋友还没有开始...

[阅读全文]

这是我们开发团队默认的样式表希望大家补充/*Author:cuikaimsty@tom.com*//*reset*/body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;paddi...

[阅读全文]

图像映射使我们可以将图像的一些区域指定为热点。下面我们来看看图像映射的xhtml和css代码：xhtml:<divid="pic"><imgsrc=http://www.jz123.cn/text/"img.jpg"width="600"height="450"alt="img"/><ul><liclass="avir...

[阅读全文]

1、仅IE7与IE5.0可以识别*+htmlselect{…}当面临需要只针对IE7与IE5.0做样式的时候就可以采用这个HACK。2、仅IE7可以识别*+htmlselect{…!important;}当面临需要只针对IE7做样式的时候就可以采用这个HACK。3、IE6及IE6以下识别*h...

[阅读全文]

行换色的问题，其实很简单，解决办法无非一下几种：1：背景图，如果行高固定的话，推荐使用背景图，也推荐将行高固定！兼容一切浏览器。2：expression文字：color:expression(this.sourceIndex%2?'#ff0000':'#000000');背景：background-color:expr...

[阅读全文]

CSS滤镜：1.Alpha滤镜语法:Alpha(Opacity=?,FinishOpacity=?,Style=?,StartX=?,StartY=?,FinishX=?,FinishY=?)代码：<fontstyle="font-size:30pt;filter:alpha(opacity=100,style=3);...

[阅读全文]

　CSS的背景属性“background”提供了众多属性值，如颜色、图像、定位等，为网页背景图像的定义提供了极大的便利。看看background提供的属性值：　　background:background-color|background-image|background-repeat|back...

[阅读全文]

有时候，我们用CSS创建一个高度自适应布局，如何保证页脚（footer）在内容不超过一屏的情况下始终保持在布局最下方是一个比较头疼的事。我看过一些利用绝对定位的例子，但总感觉不是那么完美，经过一下午的研究总结出一个利用负值外补丁的方法来实现这个效果的方法，兼容IE5.0+，Opera8.5+，Firefox1.5+。下...

[阅读全文]