今天我們來(lái)看一下css一號(hào)店的代碼吧，這是一家非常有特色的在線購(gòu)物網(wǎng)站，在這里你可以找到各種各樣的商品，而網(wǎng)站本身也非常優(yōu)秀，接下來(lái)我們來(lái)看看它的樣式代碼。

/*全局樣式*/
body {
font-family: "Hiragino Sans GB","Microsoft YaHei","\5b8b\4f53",sans-serif;
font-size: 14px;
line-height: 20px;
color: #333;
background-color: #f2f2f2;
}
a {
color: #398be1;
text-decoration: none;
}
a:hover {
color: #3a9ceb;
}

在這里，我們看到了一些全局的樣式設(shè)置，比如字體、字號(hào)、字間距、顏色等等，這些樣式規(guī)定了網(wǎng)站的整體風(fēng)格。除此之外，還有一些鏈接樣式的設(shè)置，比如顏色、下劃線等，這些讓鏈接看起來(lái)更加美觀并且易于識(shí)別。

/*頭部樣式*/
.header {
height: 80px;
background-color: #fff;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 10;
box-shadow: 0 1px 4px rgba(0,0,0,.15);
}
.logo {
width: 140px;
height: 36px;
background-image: url("http://img30.360buyimg.com/popshop/jfs/t2201/362/1554725197/5624/e6b74192/5674ce6eNa93111dc.png");
background-repeat: no-repeat;
background-size: cover;
float: left;
margin-left: 10%;
margin-top: 20px;
}
.user {
float: right;
margin-right: 10%;
margin-top: 24px;
}

這里是頭部的樣式設(shè)置，包括了頭部高度、背景顏色、位置、陰影等等，其中的.logo和.user是頭部中的logo和用戶信息的樣式設(shè)置，這些樣式規(guī)定了他們的大小、位置等等。

/*首頁(yè)樣式*/
.home .banner {
height: 480px;
background-image: url("http://img30.360buyimg.com/popshop/jfs/t1/1923/5/8636/213508/5be8e79dE39c0b848/ee1c30691bbae453.jpg");
background-repeat: no-repeat;
background-size: cover;
position: relative;
}
.home .banner .text {
position: absolute;
left: 0;
right: 0;
bottom: 20%;
text-align: center;
}
.home .banner .text h1 {
font-size: 60px;
font-weight: 700;
color: #fff;
line-height: 1.2;
margin-top: 60px;
}
.home .banner .text p {
font-size: 24px;
color: #fff;
line-height: 1.6;
margin-top: 24px;
}

這里是首頁(yè)的樣式設(shè)置，其中.banner規(guī)定了banner的高度、背景圖片等等，而其中又包括了.text表示文字的樣式設(shè)置，包括了文字的位置、大小、顏色等等。

以上就是css一號(hào)店的代碼簡(jiǎn)介，這個(gè)網(wǎng)站的樣式設(shè)計(jì)非常出色，讓人眼前一亮，你也可以在自己的網(wǎng)站中參考這些代碼，打造出自己的風(fēng)格。