<!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/htmlcharset=gb2312" />
<title>图片垂直居中,自动缩略图</title>
<meta name="author" content="calent,[email protected]" />
</head>
<style type="text/css">
<!--
*{padding:0margin:0}
body{font-size:12pxtext-align:centerfont-family:arial,sans-serif}
#wrap{width:800pxmargin:20px autotext-align:left}
#wrap ul{list-style:none}
#wrap li,#wrap .pic{width:130pxheight:100px}
#wrap li{margin:8pxfloat:leftdisplay:inlineoverflow:hiddenborder:1px solid #000}
.pic{text-align:centerdisplay:table-cellvertical-align:middleborder:1px solid #cccfont-size:88px}
.pic img{vertical-align:middle}
#copy{clear:bothpadding:5px}
-->
</style>
<script type="text/javascript">
<!--
/*
功能：图片等比例缩放
目标:ImgTag
图片宽度:FitWidth
图片高度:FitHeight
*/
var FitWidth = 130
var FitHeight = 110
function ResizePic(ImgTag)
{
var image = new Image()
image.src = ImgTag.src
if(image.width>0 &&image.height>0){
if(image.width/image.height >= FitWidth/FitHeight){
if(image.width >FitWidth){
ImgTag.width = FitWidth
ImgTag.height = (image.height*FitWidth)/image.width
}
else{
ImgTag.width = image.width
ImgTag.height = image.height
}
}
else{
if(image.height >FitHeight){
ImgTag.height = FitHeight
ImgTag.width = (image.width*FitHeight)/image.height
}
else{
ImgTag.width = image.width
ImgTag.height = image.height
}
}
}
}
//-->
</script>
<body>
<div id="wrap">
<ul>
<li><div class="pic"><img src="img/pic1.jpg" width="13px" height="10px" onload="javascript:ResizePic(this)" /></div></li>
<li><div class="pic"><img src="img/pic2.jpg" width="13px" height="10px" onload="javascript:ResizePic(this)" /></div></li>
<li><div class="pic"><img src="img/pic3.jpg" width="13px" height="10px" onload="javascript:ResizePic(this)" /></div></li>
<li><div class="pic"><img src="img/pic4.jpg" width="13px" height="10px" onload="javascript:ResizePic(this)" /></div></li>
<li><div class="pic"><img src="img/pic5.jpg" width="13px" height="10px" onload="javascript:ResizePic(this)" /></div></li>
<li><div class="pic"><img src="img/pic6.jpg" width="13px" height="10px" onload="javascript:ResizePic(this)" /></div></li>
<li><div class="pic"><img src="img/pic7.jpg" width="13px" height="10px" onload="javascript:ResizePic(this)" /></div></li>
<li><div class="pic"><img src="img/pic8.jpg" width="13px" height="10px" onload="javascript:ResizePic(this)" /></div></li>
</ul>
<div id="copy">© 2008 Design by calent</div>
</div>
</body>
</html>
Emoji 是可以插入文字的图形符号。
它是一个日语词， e 表示"絵"， moji 表示"文字"。连在一起，就是"絵文字"。
Emoji 在上个世纪90年代，由日本电信商引入服务，最早用于在短消息之中插入表情。2007年，苹果公司的 iPhone 支持了 Emoji，导致它在全世界范围的流行。
早期的 Emoji 是将一些特定的符号组合替换成图片，比如将 :) 替换成
