padding设置框内的 margin设置框外的 设置float后要设置width 高度不够设置float 撑开
float:left在一行显示 clear:both;换行

DIV弹出 position: absolute; //绝对定位(关键) visibility:hidden; //隐藏

对齐文本与文本输入框  vertical-align:middle;
block对象设置了float属性之后，它将不再独自占据一行。可以浮动到左侧或右侧

固定宽度 width=200px  自适应 宽度 width=50%
固定宽居中 margin: 0px auto;  //div p 居中

block 块状 占一整行 其他对象下一行显示

inline 内联 下一行对象在同行中显示 内联没有宽高 随内容而定
DIV DL H1-H6 hr ol ul li

使用float属性 必须给元素定义一个宽度  不是浮动对象 设置 宽 高 无效

清除浮动 clear:left 清除左边浮动对象 如果左边有浮动对象 当前元素会在浮动对象底下显示

一个元素定义了clear 不会对前后元素产生影响 只影响自己的位置

元素加了float自动变成块元素(<div>)
.clear{clear:both;}清除类(IE高度自适应)

Table 用来显示和组织数据
所有图片用背景显示

z-index 值越大 层叠级别越高

首先是一个容器，可以是div,li,td等等，先定义宽度，“white-space:nowrap”是强制在一行内显示所有文本，不回行。
“text-overflow:ellipsis”就是关键了。 text-overflow是CSS3新增的属性，IE6以上版本支持。它可以带2个参数：clip [不显示省略标记（...），而是简单的裁切]，ellipsis[当对象内文本溢出时显示省略标记（...）

]。所以，这个方法是不支持Firefox的。因此，我们还要加上一句overflow: hidden，让多余文字在ff中隐藏。

 CSS控制的内容超过容器宽度后显示省略号

Code

ul, ol
ul和ol分别是什么意思呢？ul和ol其实分别代表无序列表和有序列表。在语义上，它们都用于表示一类并列关系的内容，

例如我们去商店购物之前列一张shopping list，上面要买的东西就是并列关系，在中文可以用顿号隔开那种。

它们的差别在于是否有顺序，例如shopping list是没顺序的，先买什么后买什么是没关系的，但是一份旅游行程安排上面的景点列表却是有游览的先后顺序的。

ul常用于导航栏，因为导航元素符合上面所说的并列关系，树状导航结构还可以通过嵌套ul来表述。在这里，导航可以是我们常见的水平或竖直导航栏，甚至可以是地图导航，例

如在中国地图上不同的省份热区其实是不同的li。如果我说，在主流浏览器上用户看到了中国地图和可以直接点击省份热区，在不支持CSS的浏览器上用户能看到一份纯文本的省份

名称列表，使用的是同一份XHTML，而这完全通过CSS实现，甚至不依赖于JavaScript，你相信吗？

另外，如果你要显示一个图库的缩略图，这些图片也可以放在ul中哦，因为这些图片也是并列关系。它们可以自动先横排，排满一行就自动排第二行，CSS可以让他们乖乖排队，而

不需好像table那样把图片定死在一个格子里。其实table用于布局就如同用监狱关押内容一样，把内容锁死在一个格子里不让它到处乱跑；符合语义的XHTML就如同一个开放的舞台

，你只要懂得利用CSS的规则，内容就自然会找一个适合表现自己的地方站着。

dl
没有听说过dl吗？因为那些可视化工具生成的代码中从来不会出现dl？dl的意思是definition list，也就是定义列表。它包含的子元素不是li，而是dt和dd，也就是definition

term和definition description。dl本身设计为字典单词与解释列表这样的语义，例如：
<dl>
  <dt>Apple</dt>
  <dd>苹果</dd>
  <dt>Boy</dt>
  <dd>男孩</dd>
</dl>

然而，如果你需要表示的的语义也是类似的，一个列表既包含定义也包含解释，那么也可以考虑用dl。

div的高或者宽=高+padding或者宽+padding
padding控制content和border的距离 border框 content内容 padding内容到框之间的距离

2个块换行(不在一行)要设置距离两者较大的一个 div margin较大的一个 span 是2个margin相加
子div的margin以父块的content为参考

如果设置了父块的高宽再设置padding，内容元素受到padding的挤压  margin控制块和块的距离

position:absolute 相对于页面的距离(body)不属于上一层(子类不属于父类)
position:relative   相对于父块的定义(父块的content为基准不包括padding) 子类还是属于父类
不可层叠 可偏移
相对定位  元素本身位置 对其他元素位置 不产生影响


一开始定义CSS

Code


 js里面设置属性$("liName").style.display = "block";
直接在HTML设置<p style="color:red;"/>
<p class="a"/> 类选择符 .p
<p id="a"/>     ID选择符 #p  id只能出现一次 class可以出现多次 id优先于class
简单选择符(p)<类选择符(.p)<ID选择符(#p)
标签内>文档头>外部应用

margin 边界
padding 填充  边界到层内容之间的空白
border 边框   层边框以外留白空间
 
td.w1(w1类名)//不能有空格
#nav .selected //要空格

a:link 没有被访问过的样式
a:visited 被访问过的样式
a:hover 悬停时的样式
a:active 点下鼠标的样式 按顺序写

应该是用到min-width属性
ul.sysSet   label       {min-width:100px; display:block; float:left; text-align:left;}
/*\*/* html ul.sysSet   label { width:100px; }/**/  限制宽度 高度 IE bug

所有页面一样高
#pageMain   {width:900px; min-height:360px;height:auto;}
* html #pageMain {height:360px; } /*bug*/

RPT生成<tr><td></td></tr>
DataList   生成<table><tr><td></td></tr></table>
 Rpt 交替行 后台找UL 添加属性Code 或者前台操作

Code

几个元素样式属性一样 p,td,tr{...}

给一个元素定义多个属性 li string {...}
多重class定义 <div class="one two">
.one{..}
.two{..}