易截截图软件、单文件、免安装、纯绿色、仅160KB

《精通CSS高级WEB标准解决方案》第四章:对应链接样式

我在www.c09.com 发表了这个笔记并上传了原著的PDF,今天有空,转到BLOG上来。
第四章、对应链接样式
4.1 简单的链接样式[code]
/*所有链接红色*/
a{color:red;}
/*未访问链接蓝色,已访问红色*/
a:link{color:blue;}
a:visited{color:green}
/*鼠标悬停时链接红色*/
a:hover,active{color:red;}
/*平时不显示下划线,鼠标悬停时显示下划线*/
a:link,avisited{text-decoration:none;}
a:hover,a:active{text-decoration:underline}
[/code]4.2 让下划线更有趣[code]
/*用加粗效果代替下划线*/
a:link,avisited{
    text-decoration:none;
    font-weight:bold;
}
/*鼠标悬停时显示下划线*/
a:hover,avisited{
    text-decoration:none;
    border-bottom:1px dotted #000;
}
/*改变下划线式样*/
a:hover,a:active{
    border-bottom-style:solid;
}
/*用图片绘制下划线*/
a:link,a:visited{
    color:#666;
    text-decoration:none;
    background:url(images/underline1.gif) repeat-x left bottom;
}
/*鼠标悬停时显示动画背景*/
a:hover,a:active{
    background-image:url(images/underline1-hover.gif);
}
[/code]4.3 突出不同类型的链接[code]
/*为所有外部链接添加一个类,为该类添加一个外部邮件图标*/
.external{
    backgrount:url(images/externallink.gif) no-repeat right top;
    padding-right:10px;
}
/*不用手工添加类,自动判别外部链接(仅新版本浏览器可用)*/
a[href^="http:"]{
    background:url(images/externallink.gif) no-repeat right top;
    padding-right:10px;
}
/*本站链接除外*/
a[href^="http://www.cn09.com"],a[href^="http://cn09.com"]{
   background-image:none;
   padding-right:0;
}
/*类似的,可用添加邮件链接图标*/
a[href^="mailto:"]{
    background:url(images/email.png) no-repeat right top;
    padding-right:10px;
}
/*非标准协议如aim*/
a[href^="aim:"]{
    background:url(images/im.png) no-repeat right top;
    padding-right:10px;
}
/*pdf和word文档*/
a[href$=".pdf"]{
    backg


相关文档:

网页变灰CSS代码

使网页变灰,有两种方法可实现:
第一种,全部变灰:
<style type="text/css">
html { FILTER: gray }
</style>
 
第二种,局部变灰,广告代码不会变灰:
<style type="text/css">
BODY {filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}
</style> ......

Goodbye to CSS Hack


看看下面这段代码,是否倍感亲切但又觉得很陌生呢:
.test {
background-color: black; /* firefox, opera, ie8 */
[;background-color: green;] /* safari, chrome */
*background-color: blue; /* ie7 */
_background-color: red; /* ie6 */
}
html*~/**/body .test {
border: 5px solid ......

CSS简介

CSS(Cascading Style Sheets)层叠样式表。
·传统HTML页面排版和显示效果设置方面的问题。
·引入CSS后:Html标记专门用于定义网页的内容,而是用CSS来设置其效果。
CSS分类:
内嵌样式(Inline Style):以属性形式直接在HTML标记中给出,用于设置该标记所定义的信息效果。例如:
 <body style ......

css,javascript的预加载

css,javascript的预加载
为了提高网站的加载速度,有一个很重要的手段就是在用户浏览过程中的上游网站做一个文件的预加载。预加载文件一般有两种常用的方式:xhr和动态插入节点的方式。动态插入节点是最为简单也最为广泛的一种异步加载方式(例如yui的Get模块),然后使用动态插入节点方法加载的文件都会在加载后立即执行, ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号