网页设计那些事.docx
《网页设计那些事.docx》由会员分享，可在线阅读，更多相关《网页设计那些事.docx（46页珍藏版）》请在冰豆网上搜索。
网页设计那些事
1.HTML，CSS，font-family：
中文字体的英文名称（宋体微软雅黑）
宋体SimSun
黑体SimHei
微软雅黑MicrosoftYaHei
微软正黑体MicrosoftJhengHei
新宋体NSimSun
新细明体PMingLiU
细明体MingLiU
标楷体DFKai-SB
仿宋FangSong
楷体KaiTi
仿宋FangSong
楷体KaiTi
宋体：
SimSuncss中中文字体（font-family）的英文名称
MacOS的一些：
华文细黑：
STHeitiLight[STXihei]
华文黑体：
STHeiti
华文楷体：
STKaiti
华文宋体：
STSong
华文仿宋：
STFangsong
儷黑Pro：
LiHeiProMedium
儷宋Pro：
LiSongProLight
標楷體：
BiauKai
蘋果儷中黑：
AppleLiGothicMedium
蘋果儷細宋：
AppleLiSungLight
Windows的一些：
新細明體：
PMingLiU
細明體：
MingLiU
標楷體：
DFKai-SB
黑体：
SimHei
新宋体：
NSimSun
仿宋：
FangSong
楷体：
KaiTi
仿宋：
FangSong
楷体：
KaiTi
微軟正黑體：
MicrosoftJhengHei
微软雅黑体：
MicrosoftYaHei
装Office会生出来的一些：
隶书：
LiSu
幼圆：
YouYuan
华文细黑：
STXihei
华文楷体：
STKaiti
华文宋体：
STSong
华文中宋：
STZhongsong
华文仿宋：
STFangsong
方正舒体：
FZShuTi
方正姚体：
FZYaoti
华文彩云：
STCaiyun
华文琥珀：
STHupo
华文隶书：
STLiti
华文行楷：
STXingkai
华文新魏：
STXinwei
Windows中的中文字体。
在默认情况下，也就是未自行安装新字体或者Office等文字处理软件的情况下，Windows默认提供下列字体：
Windows95/98/98SE宋体、黑体、楷体、仿宋
WindowsXP/2000/2003/ME/NT宋体/新宋体、黑体、楷体、仿宋（WindowsXPSP3宋体-PUA）
WindowsVista/7/2008宋体/新宋体、黑体、楷体、仿宋、微软雅黑、SimSun-ExtB
那么每种字体能显示那些汉字呢？
Vista之前的Windows中宋体/新宋体、黑体支持GBK1.0字符集，
楷体、仿宋支持GB2312-80字符集。
（注：
Windows3.X只能支持GB2312-80字符集）
Vista及之后的Windows中宋体/新宋体、黑体、楷体、仿宋、微软雅黑支持GB18030-2000字符集，
SimSun-ExtB只支持GB18030-2005字符集扩展B部分。
下面对字符集进行简单的介绍：
GB2312-80GB2312-80中的字符数量最少，GB18030-2005字符数量最多。
GB2312-80是最早的版本，字符数比较少；
GBK1.0中的汉字大致与Unicode1.1中的汉字数量相同；
GB18030-2000中的汉字大致与Unicode3.0中的汉字数量相同，主要增加了扩展A部分；
GB18030-2005中的汉字大致与Unicode4.1中的汉字数量相同，主要增加了扩展B部分；
由于Unicode5.2的发布，估计GB18030会在近期发布新版本，增加扩展C部分。
需要说明的是在GB18030中扩展B部分并不是强制标准。
如果想查看GB18030的标准文本，请访问;中的强标阅读。
如果想了解Unicode的内容，请访问http:
//www.unicode.org。
现在纠正网上普遍的一个错误：
GB18030-2000和GB18030-2005都不支持单字节的欧元符号
与简体中文有关的代吗页如下：
936gb2312简体中文（GB2312）————其实是GBK
10008x-mac-chinesesimp简体中文（Mac）
20936x-cp20936简体中文（GB2312-80）
50227x-cp50227简体中文（ISO-2022）
51936EUC-CN简体中文（EUC）
52936hz-gb-2312简体中文（HZ）
54936GB18030简体中文（GB18030）
补充：
使用楷体、仿宋后，在Windows7/Vista/2008中可能不再显示为对应的字体。
这是因为Windows7/Vista/2008中有楷体、仿宋，默认情况下没有楷体、仿宋，字体名称相差“”。
2.兼容性良好的css文字描边
.sizscolor{
position:
absolute;//为了兼容IE6、IE7
filter:
Dropshadow（offx=1,offy=0,color=red）Dropshadow（offx=0,offy=1,color=red）Dropshadow（offx=0,offy=-1,color=red）
Dropshadow（offx=-1,offy=0,color=red）;//IE系列
text-shadow:
#F001px00,#F0001px0,#F00-1px00,#F000-1px0;//FF、Safari、Chrome、Opera
}
3.火狐（Firefox）/ie6.ie7.ie8兼容问题
.color{
background-color:
#CC00FF;/*所有浏览器都会显示为紫色*/
background-color:
#FF0000\9;/*IE6、IE7、IE8会显示红色*/
*background-color:
#0066FF;/*IE6、IE7会变为蓝色*/
_background-color:
#009933;/*IE6会变为绿色*/
}
**记住上面得样式解释为顺序是ff、ie8、ie7、ie6**
显示的结果：
用火狐浏览，颜色是紫色
用IE8浏览，颜色是红色
用IE7浏览，颜色是蓝色
用IE6浏览，颜色是绿色
例子：
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http:
//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
//www.w3.org/1999/xhtml">
无标题文档
.main{
width:
200px;color:
#fff;
height:
400px;background:
#f00;/*ff红色*/
height:
200px\9;background:
#ff0\9;/*ie8黄色*/
*height:
200px;*background:
#0ff;/*ie7蓝色*/
_height:
100px;_background:
#000;/*ie6黑色*/
}
ff红色height:
400px/IE8黄色height:
200px/IE7蓝色height:
200px/IE6黑色height:
100px