English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
Prima di tutto, mostriamo l'effetto visivo:
Collegamento alle risorse delle immagini:http://pan.baidu.com/s/1jHAdLNg Password: 5uo1
Il codice HTML è il seguente:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="css/base.css">
<style type="text/css">
</style>
</head>
<body>
<div class="header">
<div class="w">
<div class="top_left">
<div class="top_left_1">
<a href="#" class="top_left_1_a">Taobao</a>
<span class="top_left_1_span"></span>
</div>
<div class="top_left_2">
<a href="#" class="top_left_2_a">Messaggi</a>
<span class="top_left_2_span"></span>
</div>
<div class="top_left_3">
<a href="#" class="top_left_3_a">Taobao per cellulare</a>
<a href="#"><img src="img/qqq.gif" alt="[#0#]"></a>
</div>
</div>
<div class="top_right">
<div class="top_right_1">
<a href="#" class="top_right_1_a">Il mio Taobao</a>
<span class="top_right_1_span"></span>
</div>
<div class="top_right_2">
<a href="#" class="top_right_2_a">carrello</a>
<span class="top_right_2_span"></span>
</div>
<div class="top_right_3">
<a href="#" class="top_right_3_a">scheda dei preferiti</a>
<span class="top_right_3_span"></span>
</div>
<div class="top_right_4">
<a href="#" class="top_right_4_a">categorie di prodotti</a>
<span class="top_right_4_span">|</span>
</div>
<div class="top_right_5">
<a href="#" class="top_right_5_a">centro venditore</a>
<span class="top_right_5_span"></span>
</div>
<div class="top_right_6">
<a href="#" class="top_right_6_a">contatta il servizio clienti</a>
<span class="top_right_6_span"></span>
</div>
<div class="top_right_7">
<a href="#" class="top_right_7_a">导航 del sito</a>
<span class="top_right_7_span"></span>
</div>
</div>
</div>
</div>
<div class="head_main">
<div class="w">
<div class="head_main_img">
<a href="#"><img src="img/logo.gif" alt="[#1#]"></a>
</div>
<div class="head_main_search">
<div class="head_main_search_box">
<div class="head_main_search_box_left">
<a href="#" class="top_left_1_a">宝贝</a>
<span class="top_left_1_span"></span>
</div>
<input type="search" class="head_main_search_box_input">
<input type="button" class="head_main_search_box_button" value="Cerca">
</div>
<div class="head_main_search_a">
<a href="#" class="head_main_search_a">Ricerca Avanzata</a>
</div>
<div class="head_main_search_down">
<a href="#">Sandali Donna</a>
<a href="#">T-Shirt Uomo</a>
<a href="#">Gonna</a>
<a href="#">Borsa Donna</a>
<a href="#">T-Shirt Donna</a>
<a href="#">Canotta</a>
<a href="#">Abbigliamento Donna over 50</a>
<a href="#">Cappotto</a>
<a href="#">Abbigliamento per Bambini</a>
<a href="#">Abbigliamento per Gravidanza</a>
<a href="#">Set da Sport</a>
<a href="#">Pantaloni a Manica Lunga</a>
<a href="#">Zanzariere</a>
<a href="#" class="head_main_search_down_a">Più</a>
</div>
</div>
<div class="head_main_right">
<a href="#">Taobao Mobile</a>
<img src="img/code.png" alt="">
</div>
</div>
</div>
<div class="center_top">
<div class="w">
<div class="center_top_left">
<h5>Classificazione Prodotti e Servizi</h5>
<div class="center_top_left_ul">
<ul>
<li class="center_top_left_li_1">
<h3>Abbigliamento e Intimo</h3>
</li>
<li class="center_top_left_li_2">
<h3>Scarpe, Borse e Accessori</h3>
</li>
<li class="center_top_left_li_3">
<h3>Sport e Outdoor</h3>
</li>
<li class="center_top_left_li_4">
<h3>Joieelleria e Orologi</h3>
</li>
<li class="center_top_left_li_5">
<h3>Telefoni e Elettronica</h3>
</li>
<li class="center_top_left_li_6">
<h3>Electrodomestici e Ufficio</h3>
</li>
<li class="center_top_left_li_7">
<h3>Cura della pelle e trucco</h3>
</li>
<li class="center_top_left_li_8">
<h3>Prodotti per neonati e mamme</h3>
</li>
<li class="center_top_left_li_9">
<h3>Tappezzeria e abitazione</h3>
</li>
<li class="center_top_left_li_10">
<h3>Arredamento e materiali da costruzione</h3>
</li>
<li class="center_top_left_li_11">
<h3>Specialità culinarie</h3>
</li>
<li class="center_top_left_li_12">
<h3>Beni di uso quotidiano</h3>
</li>
<li class="center_top_left_li_13">
<h3>Automobili e motociclette</h3>
</li>
<li class="center_top_left_li_14">
<h3>Cultura e intrattenimento</h3>
</li>
<li class="center_top_left_li_15">
<h3>Vita locale</h3>
</li>
<li class="center_top_left_li_16">
<h3>Servizi virtuali</h3>
</li>
</ul>
</div>
</div>
<div class="center_top_right">
<div class="center_top_right_head">
<a href="#" class="center_top_right_head_a">Tmall</a>
<a href="#" class="center_top_right_head_a">Juhuazhuan</a>
<a href="#" class="center_top_right_head_a">Usato</a>
<span>|</span>
<a href="#">Asta</a>
<a href="#">Yitao</a>
<a href="#">Negozio di elettrodomestici</a>
<a href="#">Hitao powder makeup</a>
<a href="#">Viaggio</a>
<a href="#">Smartphone cloud</a>
<a href="#">Cina speciale</a>
<img src="img/ad.gif" alt="">
<span class="center_top_right_head_s"><a href="#">Garanzia del consumatore</a></span>
</div>
<div class="center_top_right_left">
<div class="center_top_right_left_lunbo1">
<!--<ul>-->
<!--<li><a href="#"><img src="" alt=""></a></li>-->
<!--<li><a href="#"><img src="" alt=""></a></li>-->
<!--<li><a href="#"><img src="" alt=""></a></li>-->
<!--<li><a href="#"><img src="" alt=""></a></li>-->
<!--<li><a href="#"><img src="" alt=""></a></li>-->
<!--<li><a href="#"><img src="" alt=""></a></li>-->
<!--</ul>-->
<a href="#"><img src="img/1.jpg" alt=""></a>
<!--Questa è la gallery a rotazione, deve essere scritta come-->
<div class="center_top_right_left_lunbo1_btn1">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
</div>
<a href="#"><img src="img/6.6.jpg" alt=""></a>
<div class="center_top_right_left_lunbo2">
<ul>
<li>
<a href="#"><img src="img/01.png" alt=""></a>
<a href="#"><img src="img/02.jpg" alt=""></a>
<a href="#"><img src="img/03.png" alt=""></a>
<a href="#"><img src="img/04.png" alt=""></a>
</li>
<!--<li><a href=""><img src="" alt=""></a><a href=""><img src="" alt=""></a><a-->
<!--href=""><img src="" alt=""></a><a href=""><img src="" alt=""></a></li>-->
<!--<li><a href=""><img src="" alt=""></a><a href=""><img src="" alt=""></a><a-->
<!--href=""><img src="" alt=""></a><a href=""><img src="" alt=""></a></li>-->
<!--<li><a href=""><img src="" alt=""></a><a href=""><img src="" alt=""></a><a-->
<!--href=""><img src="" alt=""></a><a href=""><img src="" alt=""></a></li>-->
<!--<li><a href=""><img src="" alt=""></a><a href=""><img src="" alt=""></a><a href=""><img-->
<!--src="" alt=""></a><a href=""><img src="" alt=""></a></li>-->
<!--<li><a href=""><img src="" alt=""></a><a href=""><img src="" alt=""></a><a href=""><img-->
<!--src="" alt=""></a><a href=""><img src="" alt=""></a></li>-->
</ul>
<div class="center_top_right_left_lunbo2_btn2">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
</div>
<a href="#"><img src="img/15.jpg" alt=""></a>
</div>
<div class="center_top_right_right">
<div class="center_top_right_right_top">
<ul>
<li class="li_1">annuncio</li>
<li>regole</li>
<li>forum</li>
<li>sicurezza</li>
<li>solidarietà</li>
</ul>
<div class="center_top_right_right_top_a">
<a href="#">淘宝2014: Apertura della diversità</a>
<a href="#">舌尖中国第二季 天猫首尝</a>
<a href="#">Sistema di facturazione auto-costruito di Ali Communication</a>
<a href="#">Primo 419 Universe Festival di Laiwang</a>
</div>
</div>
<div class="center_top_right_right_center">
<div class="center_top_right_right_center_box">
<img src="img/user-head.jpg" alt="" width="62px" height="62px">
<div class="center_top_right_right_center_box_right">
<h3>Hi_Zhiti_Liang_2011</h3>
<a href="#" class="a_1">
<span class="s1"></span>
<span class="s2">Punti di Zero Tào che possono essere convertiti in denaro</span>
</a>
<a href="#" class="a_2">Club dei membri</a>
</div>
</div>
<div class="center_top_right_right_center_down">
<a href="#" class="a1">Accedi</a>
<a href="#">Registrati gratuitamente</a>
<a href="#">Apri un negozio gratuito</a>
</div>
</div>
<div class="center_top_right_right_down">
<h3>Servizi便民</h3>
<div>
<a href="#">
<h5><img src="img/phone.png" alt=""></h5>
<h6>Spese telefoniche</h6>
</a>
</div>
<div>
<a href="#">
<h5><img src="img/game.png" alt=""></h5>
<h6>Gioco</h6>
</a>
</div>
<div>
<a href="#">
<h5><img src="img/plane.png" alt=""></h5>
<h6>Viaggio</h6>
</a>
</div>
<div>
<a href="#">
<h5><img src="img/save.png" alt=""></h5>
<h6>Assicurazione</h6>
</a>
</div>
<div>
<a href="#">
<h5><img src="img/18.png" alt=""></h5>
<h6>Lotto</h6>
</a>
</div>
<div>
<a href="#">
<h5><img src="img/move.png" alt=""></h5>
<h6>Film</h6>
</a>
</div> <div>
<a href="#">
<h5><img src="img/eat.png" alt=""></h5>
<h6>Ordinare cibo da casa</h6>
</a>
</div> <div>
<a href="#">
<h5><img src="img/money.png" alt=""></h5>
<h6>Finanza</h6>
</a>
</div> <div>
<a href="#">
<h5><img src="img/book.png" alt=""></h5>
<h6>Libri elettronici</h6>
</a>
</div> <div>
<a href="#">
<h5><img src="img/miusc.png" alt=""></h5>
<h6>Musica</h6>
</a>
</div>
<div>
<a href="#">
<h5><img src="img/bag.png" alt=""></h5>
<h6>Acqua, elettricità e gas</h6>
</a>
</div>
<div>
<a href="#">
<h5><img src="img/....png" alt=""></h5>
<h6>Aspettate con ansia</h6>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="center_top2">
<div class="w">
<div class="center_top2_left center_top2_left1">
<h3>Mercato tematico</h3>
<ul>
<li><a href="#">Donna amante dell' bellezza</a></li>
<li><a href="#">Quality Men</a></li>
<li><a href="#">Taobao Second Hand</a></li>
<li><a href="#">Global Purchase</a></li>
<li><a href="#">Brand Street</a></li>
<li><a href="#">Car Life</a></li>
<li><a href="#">Bride Wedding</a></li>
<li><a href="#">Gravidanza e bambino</a></li>
</ul>
</div>
<div class="center_top2_left center_top2_left2">
<h3 class="h3_2">Shopping di特色</h3>
<ul>
<li><a href="#">Donna amante dell' bellezza</a></li>
<li><a href="#">Quality Men</a></li>
<li><a href="#">Taobao Second Hand</a></li>
<li><a href="#">Global Purchase</a></li>
<li><a href="#">Brand Street</a></li>
<li><a href="#">Car Life</a></li>
<li><a href="#">Bride Wedding</a></li>
<li><a href="#">Gravidanza e bambino</a></li>
</ul>
</div>
<div class="center_top2_left center_top2_left3">
<h3 class="h3_3">Tendenze attuali</h3>
<ul>
<li><a href="#">Donna amante dell' bellezza</a></li>
<li><a href="#">Quality Men</a></li>
<li><a href="#">Taobao Second Hand</a></li>
<li><a href="#">Global Purchase</a></li>
<li><a href="#">Brand Street</a></li>
<li><a href="#">Car Life</a></li>
<li><a href="#">Bride Wedding</a></li>
<li><a href="#">Gravidanza e bambino</a></li>
</ul>
</div>
<div class="center_top2_left center_top2_left4">
<h3 class="h3_4">Più contenuti interessanti</h3>
<ul>
<li><a href="#">Donna amante dell' bellezza</a></li>
<li><a href="#">Quality Men</a></li>
<li><a href="#">Taobao Second Hand</a></li>
<li><a href="#">Global Purchase</a></li>
<li><a href="#">Brand Street</a></li>
<li><a href="#">Car Life</a></li>
<li><a href="#">Bride Wedding</a></li>
<!--<li><a href="#">Pregnancy and Baby</a></li>-->
<input type="button" class="center_top2_btn" value="More" >
</ul>
</div>
</div>
</div>
<div class="main">
<div class="w">
<div class="main_left">
<div class="main_left_top">
<h1>Universal Taobao</h1>
<span>Below are 30 characteristic markets waiting for you to visit!</span>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="main_left_box">
<div class="main_left_center">
<div>
<span class="s1">|</span>
<span class="s2">Women Love Matching</span>
</div>
<div class="main_left_center_left">
<img src="img/show1.png" alt="">
<h1>
<a href="#">One Year Snow Cotton Workshop</a>
</h1>
<span>Elegant Tenderness</span>
</div>
<div class="main_left_center_right">
<div class="main_left_center_right_top">
<a href="#">
<img src="img/shooes.jpg" alt="">
<p>Summer and Spring Leather Shoes</p>
</a>
<a href="#">
<img src="img/c.gif" alt="">
<p>Spring Bright Color Match</p>
</a>
<table>
<tr>
<td><a href="#">Trendy Women's Clothing</a></td>
<td><a href="#">Small Stature Fashion</a></td>
</tr>
<tr>
<td><a href="#">Plus Size Slimming</a></td>
<td><a href="#">Retro Multi-Purse Bag</a></td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="main_right">
<div class="main_right_top">
<div class="main_right_top_up">
<h1>
<a href="#">
我收藏的店铺上新
</a>
<span>更新
<span>3</span></span>
</h1>
<div class="main_right_top_up_box">
<a href="#">
<img src="img/inner1.png" alt="">
<p>￥118.00</p>
</a>
<a href="#">
<img src="img/inner2.png" alt="">
<p>￥118.00</p>
</a>
<a href="#">
<img src="img/inner3.png" alt="">
<p>￥118.00</p>
</a>
<h3><a href="#">更多店铺上新</a></h3>
</div>
</div>
<div class="main_right_top_up">
<h1>
<a href="#">
你可能新欢的店铺推荐
</a>
<span>更新
<span>3</span></span>
</h1>
<div class="main_right_top_up_box">
<a href="#">
<img src="img/inner1.png" alt="">
<p>￥118.00</p>
</a>
<a href="#">
<img src="img/inner2.png" alt="">
<p>￥118.00</p>
</a>
<a href="#">
<img src="img/inner3.png" alt="">
<p>￥118.00</p>
</a>
<h3><a href="#">更多店铺上新</a></h3>
</div>
</div>
<div class="main_right_top_up">
<h1>
<a href="#">
我的足迹
</a>
<span>更新
<span>3</span></span>
</h1>
<div class="main_right_top_up_box">
<a href="#">
<img src="img/inner1.png" alt="">
<p>￥118.00</p>
</a>
<a href="#">
<img src="img/inner2.png" alt="">
<p>￥118.00</p>
</a>
<a href="#">
<img src="img/inner3.png" alt="">
<p>￥118.00</p>
</a>
<h3><a href="#">更多店铺上新</a></h3>
</div>
</div>
<h2 class="weitao">
微淘动态
<a href="#">去广场看看</a>
</h2>
<div class="main_right_top_center">
<h3>
天猫美妆
<span>04-19 10:00</span>
</h3>
<p>【美妆课堂】"羽"你相约步步惊情 若曦四爷再续
<a href="#">查看全文</a>
</p>
<a href="#" class="a1">
<img src="img/dynamic1.jpg" alt=""width="80" height="80">
</a>
<a href="#" >
<img src="img/dynamic2.jpg" alt="" width="80" height="80">
</a>
<a href="#" >
<img src="img/dynamic3.jpg" alt="" width="80" height="80">
</a>
<h6>评论(26)</h6>
<h4> <a href="#" class="a2">更多动态 </a></h4>
</div>
<div class="main_right_top_center">
<h3>
天猫美妆
<span>04-19 10:00</span>
</h3>
<p>【美妆课堂】"羽"你相约步步惊情 若曦四爷再续
<a href="#">查看全文</a>
</p>
<a href="#" class="a1">
<img src="img/dynamic1.jpg" alt=""width="80" height="80">
</a>
<a href="#" >
<img src="img/dynamic2.jpg" alt="" width="80" height="80">
</a>
<a href="#" >
<img src="img/dynamic3.jpg" alt="" width="80" height="80">
</a>
<h6>评论(26)</h6>
<h4> <a href="#" class="a2">更多动态 </a></h4>
</div>
</div>
<div class="main_center">
<div class="main_center_up">
<h1>逛逛-精选</h1>
<div class="main_center_up_up">
<div class="main_center_up_up_lunbo1img">
<a href="#"><img src="img/sub1.jpg" alt=""></a>
</div> .
<div class="main_center_up_up_lunbo1btn">
<span></span>
<span></span>
<span></span>
</div>
<div class="main_center_up_up_right">
<img src="img/hand.jpg" alt="">
<img src="img/aaaaa.jpg" alt="">
</div>
</div>
<div class="main_center_up_p">
<p>
<span class="box">
<span class="red">[Chiffon]</span>
<a href="#">Canotta senza maniche in chiffon, elegante e giovane</a>
</span>
<span class="box">
<span>[Accessori]</span>
<a href="#">Cute! Accessori di cielo stellato meravigliosi</a>
</span>
<span class="box">
<span>[Arredamento domestico]</span>
<a href="#">Casa di 29 metri quadrati con tutto!</a>
</span>
<span class="box">
<span class="red">[Borsa]</span>
<a href="#">Borsa romantica a ragnatela, stile signorile</a>
</span>
</p>
</div>
<div class="main_center_up_center">
<a href="#" class="ma">
<img src="img/female.png" alt="">
<h5>Abbinamento di vestiti principessa bellissimi</h5>
</a>
<a href="#" class="ma">
<img src="img/home.jpg" alt="">
<h5>Arredamento per appartamenti piccoli</h5>
</a>
<a href="#" class="ma">
<img src="img/shoes.jpg" alt="">
<h5>Scarpe da passeggio in cristallo scintillante</h5>
</a>
</div>
<div class="main_center_up_p">
<p>
<span class="box">
<span >[Chiffon]</span>
<a href="#">Canotta senza maniche in chiffon, elegante e giovane</a>
</span>
<span class="box">
<span class="red">[Accessori]</span>
<a href="#">Cute! Accessori di cielo stellato meravigliosi</a>
</span>
<span class="box">
<span class="red">[Arredamento domestico]</span>
<a href="#">Casa di 29 metri quadrati con tutto!</a>
</span>
<span class="box">
<span >[Borsa]</span>
<a href="#">Borsa romantica a ragnatela, stile signorile</a>
</span>
</p>
</div>
<div class="main_center_up_center">
<a href="#" class="ma">
<img src="img/female.png" alt="">
<h5>Abbinamento di vestiti principessa bellissimi</h5>
</a>
<a href="#" class="ma">
<img src="img/home.jpg" alt="">
<h5>Arredamento per appartamenti piccoli</h5>
</a>
<a href="#" class="ma">
<img src="img/shoes.jpg" alt="">
<h5>Scarpe da passeggio in cristallo scintillante</h5>
</a>
</div>
<ul class="main_center_up_ul">
<li><em>1</em><a href="#">Coppia giovane dopo il 1985! Casa con 3 camere e 2 stanze accogliente</a><span>jjwwlove99</span></li>
<li><em>2</em><a href="#">Scarpa a gommino colorata, dolce e giovane</a><span>qh100330</span></li>
<li><em>3</em><a href="#">Bella bambina dolce vestito, 100% accattivante</a><span>Luzhaoyi Cai</span></li>
<li><em class="e1">4</em><a href="#">Pantalone da relax a piccola caviglia dimagrante, strumento per la gamba magra</a><span>vnc9999</span></li>
</ul>
</div>
<div class="main_center_down">
<img src="img/last1.png" alt="">
<img src="img/last2.jpg" alt="">
</div>
</div>
</div>
<div class="main_down">
<div class="main_down_top">
<h1>Articoli più venduti</h1>
<div class="main_down_top_right">
<a href="#">Cassa in pelle s5</a>|
<a href="#">Bose</a>|
<a href="#">Stagione autunno-inverno</a>|
<a href="#">Personalizzato</a>|
<a href="#">Pantalone a vita alta</a>|
<a href="#">Gonna da intimo</a>|
<a href="#">Reggiseno</a>|
<a href="#">Abbigliamento primavera</a>|
<a href="#">Scarpe uomo</a>|
<a href="#">iPhone</a>|
<a href="#">Sposa</a>|
<a href="#">Jeans uomo</a>|
<a href="#">T-Shirt donna</a>|
<a href="#">Maglia a maglia</a>|
<a href="#">Lampada da camera</a>|
<a href="#">Cioccolato</a>|
<a href="#">Più</a>
</div>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
<div class="main_down_goods">
<a href="#">
<img src="img/sing1.jpg" alt="">
<h3>Maglietta a collo a righe in chiffon</h3>
</a>
<p class="p1">
<span class="red">￥</span>
<span class="red">129.00</span>
<span class="green">Spedizione gratuita</span>
</p>
<p class="p2">
<span>￥</span>
<span><del>399.00</del></span>
|
<span>Venduto 29 pezzi</span>
</p>
</div>
</div>
<div class="main_ad">
<img src="img/ad.jpg" alt="" width="1200" height="90">
</div>
<div class="main_help">
<div class="main_help_info">
<h1>
<img src="img/help4.png" alt="">
<span>Garanzia del consumatore</span>
</h1>
<a href="#">Ambito di garanzia</a>
<a href="#">Flusso di reso e rimborso</a>
<a href="#">Centro di servizio</a>
<a href="#">Più servizi speciali</a>
</div>
<div class="main_help_info">
<h1>
<img src="img/help1.png" alt="">
<span>Guida per principianti</span>
</h1>
<a href="#" class="a2">Zona per principianti</a>
<a href="#" class="a2">Avvisi ai consumatori</a>
<a href="#" class="a2">Sicurezza delle transazioni</a>
<a href="#">Aiuto online 24 ore su 24</a>
</div>
<div class="main_help_info">
<h1>
<img src="img/help2.png" alt="">
<span>Metodi di pagamento</span>
</h1>
<a href="#" class="a3">Pagamento rapido di Alipay</a>
<a href="#" class="a3">Pagamento con carta Alipay (contante)</a>
<a href="#" class="a3">Pagamento con il saldo di Alipay</a>
<a href="#" class="a3">Pagamento alla consegna</a>
</div>
<div class="main_help_info">
<h1>
<img src="img/help3.png" alt="">
<span>Caratteristiche di Taobao</span>
</h1>
<a href="#">Taobao Index</a>
<a href="#">Taobao Baby</a>
<a href="#">Taobao Mobile</a>
<a href="#">Wangxin</a>
</div>
</div>
</div>
</div>
<div class="footer">
<div class="w">
<div class="footer_left">
<div class="footer_left_1">
<a href="#">Gruppo Alibaba</a>|
<a href="#">Alibaba Global</a>|
<a href="#">Cina Alibaba</a>|
<a href="#">AliExpress</a>|
<a href="#">Taobao</a>|
<a href="#">Tmall</a>|
<a href="#">Juhuasuan</a>|
<a href="#">Yi Tao</a>|
<a href="#">Ali Mama</a>|
<a href="#">Ali Cloud Computing</a>|
<a href="#">CloudOS</a>|
<a href="#">Wangwang</a>|
<a href="#">Alipay</a>|
<a href="#">来往</a>
</div>
<div class="footer_left_2">
<a href="#">su淘宝</a>|
<a href="#">partner</a>|
<a href="#">centro di marketing</a>|
<a href="#">denuncia integrità</a>|
<a href="#">contatta il servizio clienti</a>|
<a href="#">platforma aperta</a>|
<a href="#">cerca talenti</a>|
<a href="#">contattaci</a>|
<a href="#">mappa del sito</a>|
<a href="#">dichiarazione legale</a>|
<span>© 2014 Taobao.com Tutti i diritti riservati</span>
</div>
<p class="footer_left_3">
<span>licenza di gestione delle attività di cultura rete: wengwen[2010]040</span>|
<span>licenza di gestione delle attività di servizi telematici a valore aggiunto: ZheB2-20080224-1</span>|
<span>licenza di trasmissione di programmi audiovisivi per informazione rete: numero 1109364</span>
</p>
<div class="footer_left_4">
<img src="img/some.png" alt="">
</div>
</div>
<div class="footer_right">
<img src="img/tao-man.png" alt="">
</div>
</div>
</div>
</div>
<!--<div class="kong">-->
<!--</div>-->
</body>
</html>
Il codice CSS è il seguente
[html] visualizza in chiaro copia
@charset "UTF-8";
*{
margin: 0;
padding: 0;
}
.kong{
width: 100%;
altezza: 2000px;
}
a{color:#6C6C6C;; text-decoration:none; }
ul, ol { list-style:none; }
input { padding-top:0; padding-bottom:0; font-family: "SimSun","宋体";}
select, input { vertical-align:middle; }/*Il testo è centrato all'interno*/
select, input, textarea { font-size:12px; margin:0; }
textarea { resize:none; } /* Impedisce di trascinare */
a:hover{color:red;}
img {border:0; vertical-align:middle; } /* Rimuove lo spazio vuoto di default di 3 pixel sotto l'immagine */
/*Navigazione testa inizia*/
.header{
position: fixed;
z-index: 1000;
left: 0;
top: 0;
/*position: relative;*/
width: 100%;
altezza: 35px;
background-color: #F5F5F5;
font-size: 12px;
color:#6C6C6C;
line-height: 35px;
}
/*Corpo del testo*/
.w{
width: 1200px;
margin: 0 auto;
}
/*Testa sinistra inizia*/
.top_left {
width: 30%;
altezza: 35px;
float: left;
}
.top_left_1,.top_left_2,.top_left_3{
width: 48px;
altezza: 35px;
float: left;
margin-right: 5px;
}
.top_left_3{
width: 205px;
}
.top_left_1:hover,.top_left_2:hover{
sfondo: #FFFFFF;
}
.top_left_1_a,.top_left_2_a,.top_left_3_a{
margin-left: 5px;
color:#6C6C6C;
text-decoration: none;
float: left;
}
.top_left_1_a:hover,.top_left_2_a:hover,.top_left_3_a:hover{
color: red;
}
.top_left_1_span,.top_left_2_span{
visualizzazione: blocco;
larghezza: 15px;
altezza: 35px;
sfondo: url("../img/arrow.png") ripetizione non ripetuta al centro centro;
float: left;
}
/*Testa sinistra termina*/
/*Testa destra inizia*/
.top_right{
position: relative;
width: 44%;
altezza: 35px;
float: right;
}
.top_right_1,.top_right_2,.top_right_3,.top_right_4,.top_right_5,.top_right_6{
width: 75px;
altezza: 35px;
float: left;
margin-right: 5px;
}
.top_right_2,.top_right_3{
larghezza: 60px;
}
.top_right_4{
larghezza: 85px;
margine destro: 0;
}
.top_right_1:hover,.top_right_2:hover,.top_right_3:hover,.top_right_5:hover,.top_right_6:hover{
sfondo: #FFFFFF;
}
.top_right_1_a,.top_right_2_a,.top_right_3_a,.top_right_4_a,.top_right_5_a,.top_right_6_a,.top_right_7_a{
margin-left: 5px;
color:#6C6C6C;
text-decoration: none;
float: left;
}
.top_right_1_a:hover,.top_right_2_a:hover,.top_right_3_a:hover,.top_right_4_a:hover,.top_right_5_a:hover,.top_right_6_a:hover,.top_right_7_a:hover{
color: red;
}
.top_right_1_span,.top_right_2_span,.top_right_3_span,.top_right_4_span,.top_right_5_span,.top_right_6_span,.top_right_7_span{
visualizzazione: blocco;
larghezza: 15px;
altezza: 35px;
sfondo: url("../img/arrow.png") ripetizione non ripetuta al centro centro;
float: left;
}
.top_right_4_span{
sfondo: none;
margine sinistro: 17px;
}
/*Fine della parte destra della testa*/
/*Fine della navigazione principale della testa*/
/*Inizio della testa principale*/
.head_main{
width: 100%;
altezza: 115px;
margine superiore: 45px;
/*background:red;*/
}
/*Inizio della parte sinistra principale della testa*/
.head_main_img{
float: left;
larghezza: 250px;
altezza: 100px;
}
/*Fine della parte sinistra principale della testa*/
/*Inizio della ricerca principale della testa*/
.head_main_search{
margine superiore: 20px;
float: left;
larghezza: 730px;
height: 86px;
/*background: peru;*/
}
/*Start above the main search header*/
.head_main_search_box{
position: relative;
float: left;
margin-top: 10px;
width: 664px;
height: 40px;
margin-right: 10px;
border: 3px solid #f50;
}
.head_main_search_box_left{
width: 72px;
height: 40px;
line-height: 40px;
background: #f6f6f6;
cursor: pointer;
border-left: 1px solid #ffffff;
border-right:1px solid #e5e5e5 ;
font-size: 12px;
float: left;
}
.head_main_search_box_left a{
margin-left: 20px;
color: black;
}
.head_main_search_box_input{
float: left;
width: 495px;
height: 38px;
padding-left: 10px;
border: none;
outline: none;
background: url(../img/search.png) no-repeat 98% center,
url(../img/s.png) no-repeat 2% center;
}
/*End above the main search header*/
/*Start below the main search header*/
.head_main_search_box_button{
float: left;
width: 95px;
height: 40px;
border: none;
outline: none;
font-size: 20px;
letter-spacing: 5px;/*make the space between characters 5px*/
background: #f50;
cursor: pointer;
color: #fff;
}
.head_main_search_a{
width: 27px;
height: 40px;
font-size: 13px;
color:#6C6C6C;
text-decoration: none;
float: left;
}
.head_main_search_a a{
margin-top: 14px;
}
.head_main_search_down{
clear: both;
width: 100%;
height: 30px;
line-height: 30px;
}
.head_main_search_down a{
font-size: 13px;
color:#6C6C6C;
text-decoration: none;
margin-right: 2px;
}
.head_main_search_down a:hover{
color: white;
background-color: red;
}
.head_main_search_down_a{
margin-left: 3px;
border: 1px solid #ccc;
padding: 2px 5px;
}
.head_main_search_down_a:hover{
color: red;
/*background:red;*/
}
/*头部main search 下面结束*/
/*头部main search 右边开始*/
.head_main_right{
width: 94px;
height: 112px;
float: right;
position: relative;
text-align: center;
border: 1px solid #eee;
}
.head_main_right a{
font-size: 13px;
color:red;
text-decoration: none;
margin-right: 6px;
}
.head_main_right img{
margin-top: 6px;
}
/*头部main search 右边结束*/
/*头部main 结束*/
/*center_top开始*/
/*center_top_left开始*/
.center_top{
width: 100%;
height: 582px;
clear: both;
}
.center_top_left{
width: 150px;
height: 582px;
float: left;
/*background-color: yellowgreen;*/
}
.center_top_left h5{
width: 100%;
height: 41px;
line-height: 41px;
text-align: center;
font-size: 14px;
background-color: #f40;
color: #fff;
}
.center_top_left_ul{
position: relative;
width: 148px;
height: 540px;
border:1px solid #bbb;
border-top: none;
}
.center_top_left_ul ul{
position: relative;
list-style: none;
}
.center_top_left_ul li{
width: 146px;
height: 31px;
line-height: 32px;
text-align: center;
border:1px solid #fff;
cursor: pointer;
}
.center_top_left_ul li h3{
margin: 0 auto;
width: 93%;
height: 100%;
border-bottom: 1px solid #DEDEDE;
color: #707070;
font-size: 14px;
}
.center_top_left_li_1{
background: url("../img/001.png") no-repeat 10px center;
}
.center_top_left_li_2{
background: url("../img/002.png") no-repeat 10px center;
.center_top_left_li_3{
background: url("../img/003.png") no-repeat 10px center;
.center_top_left_li_4{
background: url("../img/004.png") no-repeat 10px center;
.center_top_left_li_5{
background: url("../img/005.png") no-repeat 10px center;
.center_top_left_li_6{
background: url("../img/006.png") no-repeat 10px center;
.center_top_left_li_7{
background: url("../img/007.png") no-repeat 10px center;
.center_top_left_li_8{
background: url("../img/008.png") no-repeat 10px center;
.center_top_left_li_9{
background: url("../img/009.png") no-repeat 10px center;
.center_top_left_li_10{
background: url("../img/010.png") no-repeat 10px center;
.center_top_left_li_11{
background: url("../img/011.png") no-repeat 10px center;
}.center_top_left_li_12{
background: url("../img/012.png") no-repeat 10px center;
}.center_top_left_li_13{
background: url("../img/013.png") no-repeat 10px center;
}.center_top_left_li_14{
background: url("../img/014.png") no-repeat 10px center;
}.center_top_left_li_15{
background: url("../img/015.png") no-repeat 10px center;
}.center_top_left_li_16{
background: url("../img/016.png") no-repeat 10px center;
}
.center_top_left_ul li:hover{
border: 1px solid red;
}
/*center_top_left结束*/
/*center_top_right开始*/
/*center_top_right_head开始*/
.center_top_right{
width: 1031px;
height: 582px;
float: right;
}
.center_top_right_head{
width: 100%;
height: 41px;
line-height: 38px;
font-weight: 900;
font-size: 14px;
border-bottom: 2px solid #f40;
}
.center_top_right_head a{
color: black;
font-size: 15px;
margin-left: 16px;
padding: 4px;
}
.center_top_right_head a:hover
{
background-color: #EBEBEB;
color: red;
}
.center_top_right .center_top_right_head_a{
font-size: 16px;
color: red;
}
.center_top_right_head span{
margin-left: 29px;
color: #bbbbbb;
}
.center_top_right_head img{
cursor: pointer;
margin-left: 40px;
}
.center_top_right_head .center_top_right_head_s{
margin-left: 5px;
}
.center_top_right_head_s a{
color: black;
font-weight: 600;
font-size: 12px;
margin: 0;
}
/*center_top_right_head结束*/
/*center_top_right_left开始*/
.center_top_right_left{
position: relative;
float: left;
margin-top: 10px;
width: 720px;
height: 500px;
/*background-color: red;*/
}
.center_top_right_left_lunbo1{
position: relative;
float: left;
width: 520px;
height: 280px;
overflow: hidden;
}
.center_top_right_left_lunbo1_btn1{
position: absolute;
left: 50%;
top: 250px;
margin-left: -35px;
width: 70px;
height: 11px;
/*background-color: #bbbbbb;*/
}
.center_top_right_left_lunbo1_btn1 span{
display: inline-block;
float: left;
width: 9px;
height: 9px;
margin-right: 4px;
border-radius: 9px;
cursor: pointer;
background-color: #cccccc;
}
.center_top_right_left_lunbo1_btn1 span:hover{
background-color: #6C6C6C;
}
.center_top_right_left_lunbo2{
position: relative;
float: left;
width: 520px;
height: 220px;
overflow: hidden;
}
.center_top_right_left_lunbo2 img{
margin-left: -3px;
}
.center_top_right_left_lunbo2{
position: absolute;
left: 50%;
top: 192px;
margin-left: -35px;
width: 70px;
height: 11px;
}
.center_top_right_left_lunbo2_btn2 span{
display: inline-block;
float: left;
width: 9px;
height: 9px;
margin-right: 4px;
border-radius: 9px;
cursor: pointer;
background-color: #cccccc;
}
.center_top_right_left_lunbo2_btn2 span:hover{
background-color: #6C6C6C;
}
/*center_top_right_left结束*/
/*center_top_right_right开始*/
.center_top_right_right{
position: relative;
margin-top: 10px;
float: right;
width: 300px;
height: 531px;
overflow: hidden;
/*background-color: red;*/
}
.center_top_right_right_top{
width: 298px;
height: 98px;
border-bottom: 1px solid #eee;
}
.center_top_right_right_top ul{
margin-left: -1px;
Dichiarazione: il contenuto di questo articolo è stato raccolto da Internet, di proprietà del rispettivo autore, il contenuto è stato contribuito e caricato autonomamente dagli utenti di Internet, il sito web non detiene i diritti di proprietà, non è stato sottoposto a editing umano e non assume responsabilità legali correlate. Se trovi contenuti sospetti di violazione del copyright, invia un'e-mail a: notice#oldtoolbag.com (al momento dell'invio dell'e-mail, sostituisci # con @) per segnalare, fornendo prove pertinenti. Una volta verificata, il sito web rimuoverà immediatamente il contenuto sospetto di violazione del copyright.