Tag Archives: css
要成为一个合格的CSS使用者或者开发者,书写可维护的CSS代码有非常重要的作用,能够让你的工作更加的高效率,更有可扩展性。
一、在样式表开头添加一个注释块,用以描述这个样式表的创建日期、创建者、标记等备注信息。
/*
---------------------------------
Site: Site name
Author: 25zy.com
Updated: Date and time
Updated by: Name
---------------------------------
*/
(阅读全文……)
如今的网站已经离不开CSS的网站布局和美化,如何才能写出高效规范的CSS代码呢,今天向大家介绍,特别是初学者必须要注意的七个方面:
一、使用外联样式替代行间样式或者内嵌样式
不推荐使用行间样式
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>爱吾资源博客</title>
</head>
<body>
<p style="color: red"> ... </p>
</body>
</html>
(阅读全文……)
前段时间经历了几次面试,由于有很长一段时间没有接触页面web程序了,面试的时候那些考官些总是弄得我措手不及,很多似曾相识却又一时想不出个所以然,所以丢人现眼在所难免,为了让大家能在以后的页面程序编写中能少走弯路,同时也在今后的面试中注意这些很常用但是却经常考验面试者的题目,在下面就列举了几条CSS中经常遇到的一些问题以及一些解决办法,有些是面试官考过我的,有些是我以前遇到过觉得值得大家注意的。
一、为什么中火狐浏览器下文本无法撑开容器的高度?
标准浏览器中固定高度值的容器是不会象IE6里那样被撑开的,那我又想固定高度,又想能被撑开需要怎样设置呢?办法就是去掉height,设置成min-height:200px; 这里为了照顾不认识min-height的IE6 可以加上!important;如下:
(阅读全文……)
CSS3 仍遥遥无期,还是指日可待,这不是一个技术问题,而是人们什么时候可以彻底放弃那些不符合 W3C 标准的旧浏览器的问题。CSS3 备受期待是肯定的,CSS Tricks 网站做了一次投票调查,票选备受期待的 CSS 功能,一共有7000人参与,结果如下。有趣的是结果的前三名非常的接近。

(阅读全文……)
CSS中的!important是一个非常重要的属性,有时候发挥着非常大的作用。
前几天写一些CSS代码的时候又难为我了,我把所有的CSS块儿全部使用边框包起来,结果看到在IE中两个div之间的距离明显要宽于其他浏览器,比如你写一个div的margin属性为20px,那么在IE中就好像是40px一样,这也就是为什么本来精度计算的刚刚好,在IE下却偏偏错位的原因。
后来我看到了!important这个属性,这个属性其实也是css规范中的,结果IE6愣是不支持,也正因为它不支持,才让很多的CSSer们找到了解决的方法。一般来讲,在css中,如果在同一个css块中写下两个同样的属性,那么其实是按照最下面的来执行的,比如说:
.25zy{
margin-left:20px;
margin-left:40px;
}
(阅读全文……)
一、用class_name方式写类名。
以前喜欢用class-name写,不过好像两样也没什么差别。但我比较反对用className写类名,因为始终对浏览器大小写敏感的问题抱有怀疑态度。但是id我会写成驼峰式,理由见下一条。
二、样式都用class而不用id。
有三个理由。
1,id不可以重复,所以用class的话,可以肆无忌惮的用无数次。
2,id的优先级太高,若是写了一个#page_content a {color:#f60} ,那你完蛋了,里面要改链接颜色,都必须加上#page_content才能越过这个优先级。
3,id专门留给JS用,这样才符合表现与行为分离的原则。所以id我用驼峰式,也是为了体现这一点。
(阅读全文……)
Tagged with css, 命名, 编码, 网页布局.
我们在网页编程的时候都会把css代码写到一个单独的文件里面,然后再到页面上来调用。XHTML加载CSS的几种方式,其中外部引用CSS的方式不外乎就是link和@import两种。他们大致是这样写的:
这是@import的引用方式:
<style type=”text/css” media=”screen”>
@import url(“http://www.25zy.com/themes/MsnSpace/style/MsnSpace.css”);
</style>
(阅读全文……)