您正在查看 "Css" 分类下的文章 2008年05月20日 星期二 9:09 为方便站点哀悼,特提供素装代码,以表哀悼。以下为全站CSS代码。
html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }
使用方法:这段代码可以变网页为黑白,将代码加到CSS最顶端就可以实现素装。建议全国站长动起来。为在地震中遇难的同胞哀悼。
如果网站没有使用CSS,可以在网页/模板的HTML代码<head>和</head> 之间插入:
<style>
html{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}
</style>
有一些站长的 |
2008年05月15日 星期四 16:32 搜索引擎优化(seo)有很多工作要做,其中对代码的优化是一个很关键的步骤。为了更加符合SEO的规范,下面是目前流行的DIV+CSS的命名规则:
页头:header
登录条:loginBar
标志:logo
侧栏:sideBar
广告:banner
导航:nav
子导航:subNav
菜单:menu
子菜单:subMenu
搜索:search
滚动:scroll
页面主体:main
内容:content
标签页:tab
文章列表:list
提示信息:msg
小技巧:tips
栏目标题:title
友情链接:friendLink
页脚:footer
|
2007年12月24日 星期一 10:09 <script type="text/javascript">
var mainCon=document.getElementById("sidebar-right").scrollHeight
var sidebar=document.getElementById("center").scrollHeight
layoutHeight=Math.max(mainCon,sidebar)
document.getElementById("sidebar-right").style.height=layoutHeight+"px"
document.getElementById("center |
2007年12月09日 星期日 20:41 如果同个元素有两个或以上冲突的CSS规则,浏览器有一些基本的规则来决定哪一个非常特殊而胜出。
它可能不像其它那么重要,大部分案例你不需要担心冲突,但大型而且复杂的CSS文件,或有很多CSS文件组成的,可能产生冲突。
选择器一样的情况下后面的会覆盖前面的属性。比如:
p { color: red; }
p { color: blue; }
p元素的元素将是蓝色,因为遵循后面的规则 |
2007年12月09日 星期日 20:40 伪元素吸附在选择上和pseudo classes伪类很像,像这样selector:pseudoelement{property: value;}。有四种方式。
First letters and First lines 首字母和首行
first-letter伪元素作用到元素的第一个字母,first-line作用到元素的顶行。你可以,例如为段落创建一个drop caps和首行加粗。
p:first-letter {
font-size: 3em;
floa |
2007年12月09日 星期日 20:38 At-rules分装不同的CSS规则,应用在特定场合。
Importing
import@规则引用另外的样式。例如,如果你想添加另外样式到现在的样式,可以这样:
@import url(addonstyles.css);
这很像使用link元素连接CSS到HTML,本质上说有一个内容样式像下面:
<style type="text/css" media="all">@import url(monkey.css);</style>
这是为了照顾老版本浏览器,比如Netscape4不支持@规则所以不能链接样式表,已经构建好标签的HTML页面会失去 |
2007年12月09日 星期日 20:37 使用CSS布局非常简单,如果你习惯使用tables布局,可能开始时有点困难,但其实很容易,事实上只是观念的不同。
你需要把网页的每个部分看成独立的块,你可以绝对或相对定位块。
Positioning 定位
positon属性可以指定元素为absolute,relative,static或是fixed。
static是元素默认属性,按HTML出现的先后顺序。
relative比较像static,但元素可以使用top,right,bottom和left设定初始属性。
absolute把元素从HTML里面拉出,一切由它自己决定,在这里,绝对定位元 |
2007年12月09日 星期日 20:36 操作HTML元素的诀窍在于明白它们工作的方法在于没有特定的形式。一些由标签组成的大部分页面可以设定任何样式。浏览器默认的样式里的大部分html元素由字体样式、margin,padding组成,本质上是显示类型。
display属性基本上分为inline,block,和none。
inline就像它的本意——显示为inline的元素为行。strong,anchor锚和em强调元素默认是行。
block元素前后换行。标题和段落元素是块元素。
none,意思不显示元素,在可用性上可以实现漂亮的效果,交替样式或hover效果的高级运用。
|
2007年12月09日 星期日 20:35 背景图片Background Images有许多属性可以操作。
幸运的是,可以使用background处理所有:
body {
background: white url(http://www.htmldog.com/images/bg.gif) no-repeat top right;
}
上面合并了下面属性:
background-color出现在前面。
background-im |
2007年12月09日 星期日 20:34 一些CSS属性允许使用一串值代替许多属性,值使用空格分开。
margin,pdding和border-width允许合并margin-top-width, margin-right-width, margin-bottom-width等等,形式像这样:property:top right bottom left;逆时针顺序。
所以下面的:
p {
border-top-width: 1px;
border-right-width: 5px;
border-bottom-wid |
| | |