css 全拼

html-css011

css 全拼,第1张

全拼：Cascading Style Sheets

解释：

CSS即级联样式表。

它是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。

希望能帮到你。

一般来讲这个拼图主要采用两图层直接拼图 或div 元素的背景来进行的，当然也可以是背景加上图层了 下面我们以div背景来进行实例的说明

<!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>拼图</title>

<style>

#main, #main1, #main2 {margin:100px auto width:1024px}

#main {margin:0 auto}

#img1 {background:url("http://www.e-zhao.net/templets/greed/css/img/seokey.jpg") no-repeat center top width:1020px height:153px margin:0 padding:0}

#img2 {background:url("http://www.e-zhao.net/templets/greed/css/img/step1.jpg") no-repeat center top width:1020px height:243px margin:0 padding:0}

#img3 {background:url("http://www.e-zhao.net/templets/greed/css/img/seokey.jpg") no-repeat center top width:1020px height:153px margin:0 padding:0 padding-top:153px}

</style>

</head>

<body>

<!---两图层直接拼接--->

<div id="main">

<p align="center">-两图层直接拼接</p>

<img src="http://www.e-zhao.net/templets/greed/css/img/seokey.jpg" />

<img src="http://www.e-zhao.net/templets/greed/css/img/step1.jpg" />

</div>

<!---两div背景拼图--->

<div id="main1">

<p align="center">-两div背景拼图</p>

<div id="img1"></div>

<div id="img2"></div>

</div>

<!---背景与图层的拼接--->

<div id="main2">

<p align="center">-背景与图层的拼接</p>

<div id="img3"><img src="http://www.e-zhao.net/templets/greed/css/img/step1.jpg" /></div>

</div>

</body>

</html>

简单的代码 希望你可以看的懂..