css文档中心

一、YAML
大家比较熟悉的是js框架，例如prototype、JQuery呀。其实XHTML+CSS也是
有框架的，最著名的可能就是YUI了，是yahoo开发小组的。但是那个稍微有点庞大，而且牵扯到一些的JS框架。所以刚开始研究的时候可能稍微有点累。
而这个YAML就比较单纯了。可能是现在还在发展初期所以框架很简单，东西不多，对XHMTL+CSS框架感兴趣的可以去看看哦。在国内好像还没有那个朋
友在做这个东西，如果你有兴趣，自己钻研一下说不定中国的CSS框架之祖就是你了哦。呵呵。。
网址：http://www.yaml.de/en/
里
面有源码，开发文档以及一些使用此框架搭建的页面实例。
二、blueprintcss
三、Elements
一、什么是
Elements
1.Elements是一款纯净的CSS框架，可以帮助设计师快速高效率的书写css文档。你可以将他理解成一套模板，
里面包含了大多数站点中所需要的那些css类。他很小，只有四个文件而已。总共不到6KB。
2.这四个文件分别是做什么用？
Elements.css
归纳了一些站点css中常用的css类
Reset 对一些常用的html标签进行预设。例如html, body, div, span,
applet, h1, h2, h3, h4, h5, h6....等等。
Typography
文字排版常用标签的预设。例如
body,ul,ol,dl,td, ......

CSS 概述
CSS 指层叠样式表 (Cascading Style Sheets)
样式定义如何显示 HTML 元素
样式通常存储在样式表中
把样式添加到 HTML 4.0 中，是为了解决内容与表现分离的问题
外部样式表可以极大提高工作效率
外部样式表通常存储在 CSS 文件中
多个样式定义可层叠为一
样式解决了一个普遍的问题
HTML 标签原本被设计为用于定义文档内容。通过使用 <h1>, <p>, <table> 这样的标签，HTML 当初被指望用来表达“这是标题”、“这是段落”、“这是表格”之类的信息。而文档的布局被期望由浏览器来完成，而不使用任何的格式化标签。
由于两种主要的浏览器（Netscape 和 Internet Explorer）不断地将新的 HTML 标签和属性（比如字体标签和颜色属性）添加到 HTML 规范之中，因此创建文档内容清晰地独立于文档表现层的站点变得越来越困难。
为了解决这个问题，万维网联盟（W3C），这个非营利的标准化联盟，肩负起了 HTML 标准化的使命，并在 HTML 4.0 之外创造出 STYLES（样式）。
所有的主流浏览器均支持层叠样式表。
样式表极大地提高了工作效率
样式表定义如何显示 HTML 元素，诸如 HTML 3.2 的样式中的字体标签� ......

DIV+CSS设计的网站是按照W3C标准的，如果一个站点完全是CSS+DIV制作的，那么你网站的SEO（搜索引擎优化）工作已经完成了30%！为什么会这么说？SEO其他方面在哪好，请接着我的思路往下看：
石家庄网站优化
DIV+CSS 网站相当30%的SEO工作
1、div+css网站遵循“网页结构、表现、行为分离，互不干涉抢功”理念，且不说SEO，其实按照这个理念建设起来的网站，网页打开速度会明显的加快。因为按照这个理念，网页将会分成html、css、js三种类型的文件，而css、js又是可以缓存的，所以浏览一个这样的网页其实就是下载 html 代码就行了，速度当然变快。
我们先看看SEO都做啥：
a.网页META标签会添加的比较齐全，如keyWords、description、robots;
b.被搜索引擎抓取的内容，代码比较精简，非内容代码大大减少，文件小;
c.文本会比较靠前。几乎都在200字内就可以搜索到正文，重要内容;
d.不会出现表格那样多层嵌套的问题。
2、修饰性图片文本替换，js、FLASH文字图片还原有些网站为了追求炫眼效果，采用了图片按钮，图片新闻flash切换，文本的js跑灯效果……这样大大将原本属于图片，文字链接的代码变成了搜索引擎读不懂的js代码、flash，或者是直接插� ......

<!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=gb2312" />
<title>一个比较不错的CSS表单按钮样式代码</title>
<style type="text/css">
<!--
.rb1 { border-right: #6a6a6a 1px solid; padding-right: 10px; border-top: #fff 1px solid; padding-left: 10px; font-size: 14px; background: #d32c47; padding-bottom: 3px; border-left: #fff 1px solid; cursor: pointer; color: #fff; padding-top: 3px; border-bottom: #6a6a6a 1px solid; height: 25px}
.rb2{ border-right: #6a6a6a 1px solid; padding-right: 10px; border-top: #fff 1px solid; padding-left: 10px; font-size: 14px; background: #C71E3A; padding-bottom: 3px; border-left: #fff 1px solid; cursor: pointer; colo ......

1.图片的垂直居中
.box
{
/*非IE的主流浏览器识别的垂直居中的方法*/
display: table-cell;
vertical-align: middle; /*设置水平居中*/
text-align: center;

/* 针对IE的Hack */
*display:block;
*font-size:175px;/*约为高度的0.873，200*0.873 约为175*/
*font-family:Arial;/*防止非utf-8引起的hack失效问题，如gbk编码*/

width:200px;
height:200px;
border:1px solid #eee;
}
.box img
{
/*设置图片垂直居中*/
vertical-align: middle;
}
<div class="box">
<img src="http://pics.taobao.com/bao/album/promotion/taoscars_180x95_071112_sr.jpg" mce_src="http://pics.taobao.com/bao/album/promotion/taoscars_180x95_071112_sr.jpg" />
</div>
参考文章：
http://www.planabc.net/2008/05/26/img_vertical_center_solution/
http://www.student.o ......

、在Flash加入：<param name="wmode" value="opaque">
2、在DIV里加入：position:absolute;z-index:10;（数字越大越处于上层）
FLASH透明背景
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="760" height="160">
<param name="movie" value="webjx_com.swf">
<param name="wmode" value="transparent">
<embed src="webjx_com.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="760" height="160"></embed>
</object>
要在IE中实现flash背景透明，需要加这样一个值：
<param name="wmode" value="transparent">
而在Mozilla、Firefox浏览器中起作用的是这个标签 <embed></embed> 那这样，在<embed>标签内加入属性 wmode="transparent" 就可以实现flash背景透明，遂修改代码如下：
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macro ......

CSS框架汇总

CSS 初级教程

div+css是网站优化的最基础工作

一个不错的CSS样式按钮

CSS 垂直居中

关于div/css中设置flash透明的知识

关于div/css中设置flash透明的知识