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

yui学习笔记(二) 使用css工具保持一致性

四个css工具:fonts,grids,reset,base
使元素标准化的reset.css
以下普通而常用的元素都将margin和padding值标准化到0
the document body
div and p 
所有list 元素:dl,dt,dd,ul,ol,li
标题级元素:h1,h2,h3,h4,h5,h6
pre和blockquote元素
某些表单元素:form,fieldset,input,textarea
table元素:th,td
接下来要标准化的元素是table元素,将其border设为0,图像元素的border也设为0.
防止在某些浏览器中字体会变斜体或粗体,一下元素将font-style和font-weight设为normal:
address
caption
cite
code
dfn
em
strong
th
var
接下来的规则是对有序和无序的html list元素 ,设置list-style为 none。将caption和th元素的对齐方式都严格设为左对齐
所有的标题级元素的font-size设为100%,font-weight:normal,有效地将所有标题类型设为相同的尺寸和粗细。
最后提供的样式规则是针对:before和:after,他将伪元素前后插入的内容设为空。
关于:before伪元素,在元素内容之前插入内容。这个伪元素允许创作人员在元素内容最前插入生成内容。默认地,这个伪元素是行内元素,不过可以使用display改变这一点。
<style>
div:after{content:'Hello';}
</style>
<div>World</div>
base.css
reset.css统一了不同浏览器中的默认css样式,base.css在此基础上提供了对常用元素的基本样式设置。
标题级
lists
table
清除文字样式的fonts.css
body上:
*font-size:small以及*font:x-small 为了在ie中设置font-size,纠正font-size在css1标准中的特点。
table上:
ie hack方法,ie中总显得有些小,将字体设置为108%,而其他浏览器为100%。对于A级浏览器都兼容。
使用grids.css进行布局
一个特点是自动居中布局中的内容。另一个特点是脚部,如果你想使用它,它会自动清除并且居于页面底部,无论你使用何种布局模板。
<!DOCTYPE HTML PUBLIC "-//W#C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html" charset="utf-8">
<title>Mark-up Example</title>
<link rel="stylesheet" type="text/css" href="../build/reset-fonts-grids/reset-fonts-grids.css" mce_href="build/reset-fonts-grids/reset-fonts-grids


相关文档:

CSS页面不兼容问题

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

DIV+CSS设计时浏览器兼容性问题

在这种浏览器下显示正常,在另一种下就乱了,我们在编写CSS的时候会很恼火,刚修复了这个浏览器的问题,结果另外一个浏览器却出了新问题。

-
  
什么是浏览器兼容:当我们使用不同的浏览器(Firefox IE7
IE6)访问同一个网站,或者页面的时候,会出现一些不兼容的问题,在这种浏览器下显示正常 ......

css滤镜

/**
* 給結點添加濾鏡
* 1.filterStyle形式:滤镜名称及其后的部分
* 2.Alpha 滤镜:ALPHA(opacity=opacity,finishopacity=finishopacity,style=style,startx=startx, starty=starty,finishx=finishx,finishy=finishy)}--透明
* 3.Blur 滤镜:Blur(add=add,direction=direct ......

表格头行固定:使用CSS实现

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表格头行固定:使用CSS实现</title>
<style type="text/css" >
div.DivContainer /* Div */{
    overflow: scroll;
    border: solid 1px gray; ......

csdn blog css自定义设置(转)


【作者:rare】
csdn blog css自定义设置
可以在博客的配置页面的自定义css栏中填入css样式代码来自定也blog的风格
csdn blog的页面架构基本是由div实现的,整个页面主要由三个div组成,它们的id分别是:
csdnblog_header, csdnblog_sidebar, csdnblog_content。
所以,定义它们的主体样式可以这样:
#csdnblog_heade ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号