Jul
2009
31
13:33
对css滑动门技术的一些总结和归纳,前些天加了一个设计群,里面一帮人都在嚷嚷要学css,但是不知道从哪里入手,于是我就在群里随便嘀咕了一句哈哈,我是高手....结果引来骂声无数,虽然我心里不服,不过还是承认自己的css功底不够,除了布局/文字/链接这些简单的处理之外,其他的一些行为基本不会.其中有个人说如..
Jul
2009
31
13:33
CSS样式表设计的十条技巧,1.css字体简写规则当使用css定义字体时你可能会这样做:font-size:1em;line-height:1.5em;font-weight:bold;font-style:italic;font-variant:small-caps;font-family:verdana,serif;事实上你可以简写这些属性:font:1em/1.5embolditalicsmall-capsverdana,serif现在好多了..
Jul
2009
31
13:33
CSS超级技巧大放送合集,一.使用css缩写使用缩写可以帮助减少你CSS文件的大小，更加容易阅读。css缩写的主要规则请参看《常用css缩写语法总结》，这里就不展开描述。二.明确定义单位，除非值为0忘记定义尺寸的单位是CSS新手普遍的错误。在HTML中你可以只写width=100，但是在CSS中，你必须给一个..
Jul
2009
31
13:33
网页制作之常用CSS缩写语法总结,使用缩写可以帮助减少你CSS文件的大小，更加容易阅读。css缩写的主要规则如下：颜色16进制的色彩值，如果每两位的值相同，可以缩写一半，例如：#000000可以缩写为#000;#336699可以缩写为#369;盒尺寸通常有下面四种书写方法:property:value1;表示所有边都是一个值value1..
Jul
2009
31
13:33
认清CSS的类class和标识id选择符,认清CSS的类class和标识id选择符在CSS初级教程中我们仅仅考虑了HTML选择符──以HTML标签形式出现。你当然可以用类选择符class和标识选择符id来定义自己的选择符。这样做的好处是，依赖于class或者id，你可以不同地表现相同的HTML元素。在CSS中，类选择符在一个半角英文..
Jul
2009
31
13:33
用CSS设计高用户体验的web文字大小,在开发网络应用时，没有比外观更重要的事情了。所以，如果发现设计人员十分关注字体及字体大小，我不会感到奇怪!在设计网络应用时，您必须决定如何编辑字体。使用CSS时存在大量选项，每个开发者都有自己的喜好。本文主要讨论字体大小和网络应用内的操作。字体大小CSS2规..
Jul
2009
31
13:33
实时切换网页的CSS样式实现,实时切换CSS样式用W3C标准建造的网站，从理论上来说可以做到完全的表现与结构相分离。打个比方，就是可以在不动骨架（结构，XHMTL）和肌肉（行为，Javascript）的前提下，彻彻底底地换一身皮（表现，CSS）。当然，换皮之前你需要先按W3C标准建好你的网站，并且为它准备..
Jul
2009
31
13:33
CSS实现当前页的滑动门菜单效果方法,当前页面--比如说现在的页面是首页，那么在导航栏上首页的色彩等和其他栏目有所不同，用以给浏览者一个明显的指示。下面来说下具体的做法，菜单的基本实现和一般的CSS菜单没多大区别，着重说下如何实现当前页。设菜单有5个栏目:home、about、products、services、conta..
Jul
2009
31
13:33
在CSS样式表里使用JavaScript,CSS样式里使用JavaScriptonmouseover/onmouseoutlt;!DOCTYPEHTMLPUBLIC-//W3C//DTDHTML4.0Transitional//ENgt;lt;HTMLgt;lt;HEADgt;lt;TITLEgt;CSS样式里使用JavaScriptonmouseover/onmouseout2lt;/TITLEgt;lt;METANAME=GeneratorCONTENT=EditPlusgt;lt;META
Jul
2009
31
13:33
CSS实现导航条图片的翻转菜单,如果用传统的方法制作这个翻转菜单，至少需要把图片切成10块，还要加上JS代码，在图片按钮上再加行为，现在完全用CSS来实现，图片只要一张，见下图：CSS代码:以下是引用片段：#imgmenu{width:nbsp;450px;height:nbsp;25px;nbsp;/*高度是背景图片的一半*/background:nbs..
Jul
2009
31
13:33
用CSS实现的一张图完成的导航条,lt;!DOCTYPEhtmlPUBLIC-//W3C//DTDXHTML1.0Transitional//ENhttp://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=gb2312/gt
Jul
2009
31
13:33
CSS仿淘宝首页导航条按钮布局效果,lt;htmlgt;lt;headgt;lt;metahttp-equiv=Content-Typecontent=text/html;charset=gb2312gt;lt;titlegt;网页特效代码---CSS仿lt;ahref=http://com.chinabyte.com/taobao/class=bluekeytarget=_blankgt;淘宝lt;/agt;首页导航条按钮布局效果lt;/titlegt;lt;stylegt;/*子鼠..
Jul
2009
31
13:33
CSS制作的阴影链接文字,lt;htmlgt;lt;headgt;lt;metahttp-equiv=Content-Typecontent=text/html;charset=gb2312gt;lt;titlegt;网页特效观止|http://homepage.yesky.com/|---CSS制作的阴影链接文字lt;/titlegt;lt;/headgt;lt;bodygt;lt;stylegt;ul,li{margin:0px;padding:0px;list-style-type:..
Jul
2009
31
13:33
用CSS层叠样式表实现文字变图象特效,一段文字，当鼠标在文字上面单击，文字消失，原来文字的地方却立即变成了一张图片，当鼠标在图片上单击，图片又消失，原来的文字又重现了，像变魔术一样，是不是有意思?!这种效果用Dreamweaver的Behavirs功能也可实现，但那要增加一段Javascript程序，明显增加了不少代..
Jul
2009
31
13:33
你知道这些css网页设计技巧吗,本翻译并未得到作者或网站授权。一切权利都归原作者及原网站所有。如果你得到原作者或原发表网站的授权，可以自由使用本翻译。1.CSS字体属性简写规则一般用CSS设定字体属性是这样做的：font-weight:bold;font-style:italic;font-varient:small-caps;font-size:1em;line..
Jul
2009
31
13:33
用CSS层叠样式表完成可以控制的闪烁效果,一段文本或一张图片，它的周围有一圈光晕，这圈光晕每一秒钟闪烁一次，而当鼠标移到上面时，立即停止闪烁，当鼠标移开时又继续闪烁。这种效果用于那些需要特别引起别人注意的内容上如:警示、报告新增内容等，能起到较好的效果。上面这个示例就能实现上面所的效果，由于..
Jul
2009
31
13:33
如何用CSS来控制网页字体的显示样式,HTML对于＜font＞内容＜/font＞卷标只有：＜fontcolor=colorvaluesize=fontsizeface=字型＞＜/font＞这3种设定，而关于CSS对于＜font＞内容＜/font＞的延伸规格让我们可以对字型的有更详细的设定。对于字型的设定：font-family:字型名称1,字型名称3,字型名称3等等。显示..
Jul
2009
31
13:33
如何用CSS层叠样式表控制鼠标显示的样式,一般而言，鼠标以斜向上的箭头显示，移到文本上时变为有头的竖线，移到超级链接上变为手型。但用css可控制鼠标的显示效果，如可使鼠标移到普通文本上也显示成手型。用css控制的语法如下:lt;spanstyle=cursor:*gt;文本或其它页面元素lt;/spangt;把*换成如下15个效果的一..
Jul
2009
31
13:33
expression将JS、Css结合起来,IE5及其以后版本支持在CSS中使用expression，用来把CSS属性和Javascript表达式关联起来，这里的CSS属性可以是元素固有的属性，也可以是自定义属性。就是说CSS属性后面可以是一段Javascript表达式，CSS属性的值等于Javascript表达式计算的结果。在表达式中可以直接引用元..
Jul
2009
31
13:33
常用CSS,/**//*按钮样式*/.ButtonCss{}{nbsp;nbsp;nbsp;font-family:Tahoma,宋体;nbsp;nbsp;nbsp;font-size:9pt;color:#003399;nbsp;nbsp;nbsp;border:1px#003399solid;nbsp;nbsp;nbsp;color:006699;nbsp;nbsp;nbsp;BORDER-BOTTOM:#93bee21pxsolid;nbsp;nbsp;nbsp;BORDER-LEFT:.
Jul
2009
31
13:33
调整CSS类型的顺序改变链接状态,你也许已经意识到，你可以通过指定每一键接的不同风格以建立CSS翻滚效果，这些链接包括普通的链接linknormal,访问，翻转，以及激活。并且，你可能也知道CSS类型的顺序可以产生效果上的差别，CSS代码后顺序的风格将会取代针对于相同元素的前顺序的风格。建立翻滚效果的类..
Jul
2009
31
13:33
图片防盗链代码,原地址:http://siyizhu.com/article.asp?id=496实现方法很简单在CSS中添加以下代码:img{nbsp;filter:expressionnbsp;this.不能去掉?:nbsp;nbsp;!this.complete?:nbsp;this.runtimeStyle.filter=progid:DXImageTransform.Microsoft.AlphaImageLoadersrc='+this.src+'+nb..
Jul
2009
31
13:33
用CSS代码轻松Diy你的网页滚动条,nbsp;nbsp;nbsp;在浏览网页的时候我们有时可以看到有的网页滚动条颜色不是系统默认的，而是漂亮的红色或其它颜色，其实这就是在网页代码之间加入代码来实现的，具体是哪些代码呢？nbsp;nbsp;nbsp;nbsp;网页滚动条代码及其解释如下：（复制时请将大写尖括号改为小写）以..
Jul
2009
31
13:33
用CSS样式固定表格宽度,在table或div里显示文章的时候，如果是汉字，文章会根据table和div的width属性自动分行，但如果是英文，当单词长度超过table或div宽度的时候，table/div便会被撑开，有时候会造成页面很难看，这时可以给table/div设置如下样式：word-break:break-all;word-wrap:break-w..
Jul
2009
31
13:33
利用相对定位及偏移量做精美输入界面,利用相对定位和偏移量属性，可以很好的实现以前需要用图片才能实现的界面，而且实现起来比也很方便。例如，当需要用户输入某些信息，我们常常会用到：标题栏－内容－确定按钮这种结构，下面是利用CSS样式的相对定位及偏移量做的输入界面。主要特点是：标题栏图片有向上..
Jul
2009
31
13:33
网站重构：利用CSS改善网站可访问性,最近，我不得不对我的一个客户的旧网站进行更新，使得它能够达到可访问性的标准。对三四年前的旧代码进行挖掘的想法根本没有吸引力，主要是因为我曾经使用的很多编程惯例已经不再适用，特别是从可访问性上来讲。我曾经使用绝对的字体大小，固定的页面宽度和表格来做版面..
Jul
2009
31
13:33
用CSS做滑动效果的图片画廊,代码如下：以下是引用片段：lt;stylegt;#galleryh{nbsp;padding:0;nbsp;margin:0auto5emauto;nbsp;list-style-type:none;nbsp;overflow:hidden;nbsp;width:495px;nbsp;height:240px;nbsp;border:1pxsolid#888;nbsp;background:#fffurl/imagelist/06/24/o9642o826u4n.g
Jul
2009
31
13:33
用CSS打造可折叠伸缩名片菜单,现看看其CSS样式表代码：以下是引用片段：lt;styletype=text/cssgt;lt;!--#menu{nbsp;font-size:12px;nbsp;height:380px;nbsp;margin:0;nbsp;padding:0;nbsp;width:180px;nbsp;overflow:hidden;nbsp;background:#f0f0f0;nbsp;list-style:none;nbsp;border-left:1pxsoli..
Jul
2009
31
13:33
CSS+DIV:让文本字符环绕在你的图片周围,看到上面的效果，你也许以为这是一张带文字的图片而已;呵呵，用你的鼠标去选取文字看看，发现了吧，这完完全全是一张图片和文字的组合，下面我就来介绍它是怎么做的。先看看代码:以下是引用片段：lt;divid=infogt;lt;h2gt;TRACKINGYOURIMAGESlt;/h2gt;lt;divid=holditg..
Jul
2009
31
13:33
用相对定位和负向移动完成图片象框阴影,nbsp;nbsp;nbsp;nbsp;先看看代码，十分简单：以下是引用片段：lt;stylegt;.out{nbsp;position:relative;nbsp;background:#bbb;nbsp;nbsp;margin:10pxauto;nbsp;width:285pxnbsp;}.in{nbsp;background:#fff;nbsp;nbsp;border:1pxsolid#555;nbsp;padding:10px5px;positio.
