随笔分类 -  Css

css网页设计技巧集
摘要:1.CSS字体属性简写规则一般用CSS设定字体属性是这样做的:font-weight:bold;font-style:italic;font-varient:small-caps;font-size:1em;line-height:1.5em;font-family:verdana,sans-serif;但也可以把它们全部写到一行上去:font: bold italic small-caps 1e... 阅读全文

posted @ 2010-11-26 17:16 与时俱进 阅读(201) 评论(0) 推荐(0) 编辑

网页设计中CSS注意点
摘要:1.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.5em bold italic small-caps ver... 阅读全文

posted @ 2010-11-26 17:10 与时俱进 阅读(1193) 评论(1) 推荐(0) 编辑

css浮动层垂直水平居中固定兼容火狐、ie6、ie7、ie8
摘要:<style type="text/css">.box{width:200px; height:200px; border:1px solid #000; position:fixed; left:50%; top:50%;margin-left:-100px;margin-top:-100px;_position:absolute;_top:expression(eval(docum... 阅读全文

posted @ 2010-09-01 12:03 与时俱进 阅读(3340) 评论(0) 推荐(0) 编辑

css资源网站收集推荐
摘要:非原创,来源网络。感谢原作者奉献如此精彩文章。原文地址:http://www.jianbitou.com/post/20_websites-learn-master-css.html1.A List Apart CSS TopicsA List Apart是一个CSS优秀文章的收集网站,从1999年开始收集文章,关注最佳网页设计。2.CSS Help PileCSS Help Pile重点关于CS... 阅读全文

posted @ 2010-03-27 00:16 与时俱进 阅读(914) 评论(1) 推荐(0) 编辑

DIV+CSS网页布局常用的一些命名规则和书写
摘要:CSS样式命名规范一.文件命名规范全局样式:global.css;框架布局:layout.css;字体样式:font.css;链接样式:link.css;打印样式:print.css;二.常用类/ID命名规范页 眉:header内 容:content容 器:container页 脚:footer版 权:copyright 导 航:menu主导航:mainMenu子导航:subMenu标 志:log... 阅读全文

posted @ 2010-03-25 00:23 与时俱进 阅读(355) 评论(0) 推荐(0) 编辑

CSS布局:让页脚始终保持底部的方法
摘要:有时候,我们用CSS创建一个高度自适应布局,如何保证页脚(footer)在内容不超过一屏的情况下始终保持在布局最下方是一个比较头疼的事。我看过一些利用绝对定位的例子,但总感觉不是那么完美,经过一下午的研究总结出一个利用负值外补丁的方法来实现这个效果的方法,兼容IE5.0+,Opera 8.5+,Firefox 1.5+。下面我们看步骤: 1、为了让浏览器识别高度100%我们需要先给 html 和 ... 阅读全文

posted @ 2010-02-27 23:03 与时俱进 阅读(438) 评论(0) 推荐(0) 编辑

css简写用法说明
摘要:简单的说,css简写就是在等效的前提下,把多句css代码简化成一句。在我看来,简写css的好处有三:一是写起来方便(就像键盘快捷键);二是简化代码;三是帮助你熟悉和深刻理解css。闲话少说,书归正传。能够简写的css属性主要有以下几个:font简写:font:italic small-caps bold 12px/1.5em arial,verdana;等效于:font-style:italic;... 阅读全文

posted @ 2010-02-26 13:44 与时俱进 阅读(338) 评论(0) 推荐(0) 编辑

可以给img元素设置背景图
摘要:惊叹于老外的发现 《CSS Background image on html image element?》,自己从没关注过,也没想过如此的问题。实现方法很简单:设置 img 元素为块元素(display:block;),并赋一个 padding 值。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w... 阅读全文

posted @ 2009-12-25 21:33 与时俱进 阅读(7883) 评论(1) 推荐(2) 编辑

IE8 CSS hack
摘要:IE8正式版出来有一段日子了,但是针对ie8正式版的CSS hack却很少,其实这是值得庆幸的,因为ie8修复了很多IE6和IE7的一些BUG,更加接近W3C标准。 针对IE8正式版的CSS hack目前可以找到的分为2种: 第一种:”\9″: 基本的写法: 1..test { color/*\**/: blue\9 } 这个IE6、IE7、IE8都能识别;但是IE8不能识... 阅读全文

posted @ 2009-11-24 19:16 与时俱进 阅读(24754) 评论(1) 推荐(1) 编辑

Javascript+css 实现网页换肤功能
摘要:现在网站换皮肤是比较常见的功能,大多数论坛都有的,要想实现这样效果可以看如下代码:Html代码部分:1.要有一个带id的样式表链接,我们要通过操作这个链接来调用不同的href.<link href="css/main0.css" rel="stylesheet" type="text/css" id="cssfile" />2.皮肤选择按钮(后台为每个li添加onclick事件,触发换... 阅读全文

posted @ 2009-11-01 16:34 与时俱进 阅读(769) 评论(0) 推荐(0) 编辑

中文排版CSS心得
摘要:数月来学习web标准,并遵循标准设计和制作web页面。一直想写点什么,整理一下自己的心得体会。写这篇文章,主要是针对中文排版设计,英文排版因为很少做,所以不涉及。先介绍如何设定字体、颜色、大小、段落空白等比较简单的应用,后面再介绍下比如首字下沉、首行缩进。最后讲一些常用的web页面中文排版,比如中文字的截断、固定宽度词内折行(word-wrap和word-break)等等。因为只是写一些应用方面的... 阅读全文

posted @ 2009-09-29 12:54 与时俱进 阅读(417) 评论(2) 推荐(1) 编辑

简单CSS hack:区分IE6、IE7、IE8、Firefox、Opera
摘要:方法一:跨浏览器的网页设计一直是让人很头疼的问题,这不只是因为浏览器的版本众多,还有一个重要的原因是相同浏览器的不同时期的版本也会有差异, 甚至是在不同操作同台上还会有不同。因此使CSS hack技术进行浏览器区分是实现跨浏览器访问一个好方法。CSS Hack技术有很多,具体可以查看:本文据说的主要是通过“.”,“>”,“*R... 阅读全文

posted @ 2009-09-28 09:32 与时俱进 阅读(376) 评论(1) 推荐(0) 编辑

动态添加样式规则
摘要:以前我就是一篇博文 就给出一个好用的函数,它在我几篇博文中被广泛运用的。最近看了不少东西,于是便有了这篇博文,以梳理我学到的新东西。 毫无疑问,基于表现与结构相分离的原则,直接导入一个新的样式表是最好的选择,但有些情况就行不通,如我们做一个能拖动的DIV,从设置样式的角度看,就 是把它绝对定位,以防影响原来的文档流,然后一点点改变其top与left的值实现移动的效果。由于拖动是有时间概念的,一秒... 阅读全文

posted @ 2009-09-08 07:44 与时俱进 阅读(1020) 评论(0) 推荐(0) 编辑

使用css实现透视的效果
摘要:今天萌发一个想法,用css来实现透视效果。起初,我想到的是我们常见的添加阴影效果的方法,用多个div通过偏移来实现,但这需要很多 div,不够理想。随后,我想到css的一个属性:border,在border相连接处可以产生对角线效果。这样用两个div就可以实现,我们先看看 最终效果 ,然后再分析实现过程。 首先,我们看看border如何生成的对角线效果,在你的html的头部增加以下代码,你就会看... 阅读全文

posted @ 2009-09-08 07:41 与时俱进 阅读(536) 评论(0) 推荐(0) 编辑

css div设置float后高度不能自动增加
摘要:目前用来清除“闭合(清除)浮动”的方法,主要是一下四种: 1. 额外标签法 这种方法就是向父容器的末尾再插入一个额外的标签,并令其清除浮动(clear)以撑大父容器。这种方法浏览器兼容性好,没有什么问题,缺点就是需要额外的(而且通常是无语义的)标签。我个人不喜欢这种方法,但是它确实是W3C推荐的方法 <div style="clear:both;"></... 阅读全文

posted @ 2009-09-08 07:37 与时俱进 阅读(465) 评论(0) 推荐(0) 编辑

DIV CSS完美兼容IE6/IE7/FF的通用方法
摘要:关于CSS对各个浏览器兼容已经是老生常谈的问题了, 网络上的教程遍地都是.以下内容没有太多新颖, 纯属个人总结, 希望能对初学者有一定的帮助. 一、CSS HACK 以下两种方法几乎能解决现今所有HACK. 1, !important 随着IE7对!important的支持, !important 方法现在只针对IE6的HACK.(注意写法.记得该声明位置需要提前.) 以下为引用的内容:&... 阅读全文

posted @ 2009-09-08 07:36 与时俱进 阅读(1153) 评论(2) 推荐(4) 编辑

把CSS BUG编成了顺口溜
摘要:一、IE边框若显若无,须注意,定是高度设置已忘记; 二、浮动产生有缘故,若要父层包含住,紧跟浮动要清除,容器自然显其中; 三、三像素文本慢移不必慌,高度设置帮你忙; 四、兼容各个浏览须注意,默认设置行高可能是杀手; 五、独立清除浮动须铭记,行高设无,高设零,设计效果兼浏览; 六、学布局须思路,路随布局原理自然直,轻松驾驭html,流水布局少hack,代码清爽,兼容好,友好引擎喜欢迎。 七、所有标签... 阅读全文

posted @ 2009-08-29 09:00 与时俱进 阅读(320) 评论(1) 推荐(0) 编辑

IE与FireFox的js和css
摘要:png透明 AlphaImageLoader filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=bEnabled,sizingMethod=sSize,src=sURL) enabled:可选项。布尔值(Boolean)。设置或检索滤镜是否激活。true:默认值。滤镜激活。false:滤镜被禁止。 sizingMet... 阅读全文

posted @ 2009-03-30 13:28 与时俱进 阅读(501) 评论(0) 推荐(0) 编辑

SEO中的DIV CSS样式的命名规则
摘要:在搜索引擎优化中, 对于代码的优化是一个非常重要的部分。 如果一个网页的代码非常的简捷,对于提升网站的排名那个是非常有好处的。 同样, 在CSS样式表中,合理有序的命名同样可以为整个CSS工作带来意想不到的简便。 为了更加符合搜索引擎的规范, 下面是一些常用的CSS代码命名标准。 这些标准虽然不是一个必须遵守的规范,但是,却被大多数SEOer所接受,并为整个网站的更新工作带来方便。 页头:head... 阅读全文

posted @ 2009-03-30 13:24 与时俱进 阅读(261) 评论(0) 推荐(0) 编辑

一个CSS文件内如何设置多个body及多个DIV样式,并给出页面如何调用
摘要: 阅读全文

posted @ 2009-03-30 13:19 与时俱进 阅读(1474) 评论(0) 推荐(0) 编辑

友情链接:同里老宅院民居客栈