日志标签：Css

3种让PNG在IE6下透明的方案

时间：2010年02月28日作者：青雨被围观 688 次评论次数：1

现在做很多页面，比如阴影，或很多情况要用到透明图，GIF图一般会有很多锯齿，
用PNG图吧，效果到是还好。Firefox和IE7以上版本都支持PNG透明，但IE6缺会显示灰白。

第一种，适用于图片做背景的时候。代码：
继续阅读：3种让PNG在IE6下透明的方案»

标签：,分类：Html/Css

区分IE6，IE7，firefox三种浏览器的CSS HACK

时间：2010年02月23日作者：青雨被围观 338 次评论次数：0

区别IE6与FF：
background:orange;*background:blue;

区别IE6与IE7：
background:green !important;background:blue;

区别IE7与FF：
background:orange; *background:green;

区别FF，IE7，IE6：
background:orange;*background:green !important;*background:blue;

继续阅读：区分IE6，IE7，firefox三种浏览器的CSS HACK»

标签：分类：Html/Css

CSS盒子模式(DIV布局快速入门)

时间：2010年02月22日作者：青雨被围观 356 次评论次数：0

如果你想尝试一下不用表格来排版网页，而是用CSS来排版你的网页，也就是常听的用DIV来编排你的网页结构，又或者说你想学习网页标准设计，再或者说你的上司要你改变传统的表格排版方式，提高企业竞争力，那么你一定要接触到的一个知识点就是CSS的盒子模式，这就是DIV排版的核心所在，传统的表格排版是通过大小不一的表格和表格嵌套来定位排版网页内容，改用CSS排版后，就是通过由CSS定义的大小不一的盒子和盒子嵌套来编排网页。因为用这种方式排版的网页代码简洁，更新方便，能兼容更多的浏览器，比如PDA设备也能正常浏览，所以放弃自己之前钟爱的表格排版也是值得的，更重要的是CSS排版网页的优势远远不只这些。

理解CSS盒子模型
什么是CSS的盒子模式呢？为什么叫它是盒子？先说说我们在网页设计中常听的属性名：内容(content)、填充(padding)、边框(border)、边界(margin)， CSS盒子模式都具备这些属性。
CSS盒子模式
继续阅读：CSS盒子模式(DIV布局快速入门)»

标签：分类：Html/Css

2008年50个CSS设计欣赏

时间：2009年02月20日作者：青雨被围观 361 次评论次数：0

这是 webdesignerwall.com 2008年精选的50个最佳 CSS 设计，素材来源是 Best Web Gallery。从今年的设计趋势来看，越来越多的人使用大背景，以及 JavaScript 框架（ jQuery 与 MooTools）来增强用户界面。也有个别设计，将 Flash 与 CSS 结合起来使用，这也许是2009年的趋势。 Let It Bleed
夺目的视觉效果


Vermont Coffee Works
Flash 结合 CSS

 

继续阅读：2008年50个CSS设计欣赏»

标签：分类：Html/Css

不用JS的漂浮层

时间：2009年02月19日作者：青雨被围观 388 次评论次数：0

HTML部分：

代码:
<a name=”Top”></a>
<div style=”border: 1px solid #ff0000; height: 1000px”></div>
<div id=”TargetTOP”><a h ref=” # Top”>跳转到页面顶部</a></div>

继续阅读：不用JS的漂浮层»

标签：分类：Html/Css

提高网页的维护更新效率(CSS篇)

时间：2009年02月19日作者：青雨被围观 303 次评论次数：0

　　　　提高网页的维护更新效率–样式表高效使用 
　　 
　　随着互联网经济的不断发展，互联网上的专业网站、公众服务网站以及企业门户的数量都在飞速的增长，各网站的信息量也呈爆炸性增长的趋势。面对这些庞大的信息量，我们对网页中每一个栏目的增删，都会是一个很复杂的过程。为了提高网页的维护更新效率，我们可以使用样式表，来仅仅改变一个文件，就能达到同时改变几百个网页的外观，而其个性化的表现未受任何损失。为了能充分用好样式表的强大性和灵活性，笔者就怎样有效使用样式表，来谈谈自己的一些心得体会。 
　　 
　 继续阅读：提高网页的维护更新效率(CSS篇)»
标签：分类：Html/Css

WEB标准

时间：2009年02月19日作者：青雨被围观 357 次评论次数：0

WEB标准不是某一个标准，而是一系列标准的集合。网页主要由三部分组成：结构（Structure）、表现（Presentation）和行为（Behavior）。对应的标准也分三方面：结构化标准语言主要包括XHTML和XML，表现标准语言主要包括CSS，行为标准主要包括对象模型（如W3C DOM）、ECMAScript等。这些标准大部分由W3C起草和发布，也有一些是其他标准组织制订的标准，比如ECMA（European Computer Manufacturers Association）的ECMAScript标准。我们来简单了解一下这些标准：  继续阅读：WEB标准»

标签：分类：Html/Css

在CSS中关于字体处理效果的思考

时间：2009年02月19日作者：青雨被围观 346 次评论次数：0

字体的处理在网页设计中无论怎么强调也不为过，毕竟网页使用来传递信息的，而最经典最直接的信息传递方式就是文字，所以，了解一点字体的基本知识对于设计来说还是非常重要的。中文和英文的最大区别就是中文是方块字，英文是拼音文字，这对字体的处理的影响是巨大的。看看下面的图示就会发现，英文字体里的那些变化在中文字体里都弱化了。作为中文的读者，习惯性的接受方块形状做为阅读的单元，其实对于眼睛来说，这是一种容易疲劳的方式，阅读的时候你的视线实际上是跟随整行文字的外形。看看这个例子。 

NOW I VE TRIED TO TALK TO YOU AND MAKE YOU UNDERSTAND 
Now I ve tried to talk to you and make you understand 

哪一行更容易读呢？第一行和中文的情形有些类似，不同的是， 继续阅读：在CSS中关于字体处理效果的思考»

标签：分类：Html/Css

应用CSS样式表技巧两则

时间：2009年02月19日作者：青雨被围观 357 次评论次数：0

一、 去除超级链接的下划线以及在超级链接上实现鼠标悬停变色：   
　　在默认情况下，用DreamWeaver设计的网页中的超级链接都有下划线，看上去不大美观。要去除这些讨厌的下划线,很多报刊介绍的方法都是在HTML源代码中手工加入一段代码，其实在DreamWeave中很容易去除链接的下划线。首先在DreamWeaver的Document Windows中随便建立一个链接，你可以看到这个链接会有下划线。怎样去除这条下划线呢？   
　　1.在点击菜单栏上的”Text”|”CSS Styles”| ”Edit Style Sheet…”(或者直接按快捷键Ctrl+shift+E),调出Edit Style Sheet（编辑样式表）对话框窗口。   
　　2.点击”New (新建)”，然后在”New Style （新样式）”对话框中，点击”Use CSS Selector”按钮。   
　　3.在Selector栏中键入a, 然后点OK。   
　　4.随后弹出”CSS 样式定义”对话框， 继续阅读：应用CSS样式表技巧两则»
标签：分类：Html/Css

有关表格边框的css语法整理

时间：2009年02月19日作者：青雨被围观 308 次评论次数：0

我们知道Dreamweaver在表格制作方面做得非常出色，但是在某些时候还是必须结合css才能达到一些特定效果，下面我们先把有关表格边框的css语法整理出来，然后另外介绍怎样用css美化表格的边框。 
　　有关表格边框的css语法

　　具体内容包括：上边框宽度、右边框宽度、下边框宽度、左边框宽度、边框宽度、边框颜色、边框样式、上边框、下边框、左边框、右边框、边框、宽度、高度、有关标签等。

　　 1.上边框宽度 继续阅读：有关表格边框的css语法整理»

标签：分类：Html/Css