网站建设的网站访客的设计片段

2016-04-11 17:21:52

网络趋势似乎在一夜之间改变。每年新的美貌使他们进入代码的网站在互联网上引起设计师开始思考如何将这些风格的组合。

幸运的是，级联样式表（CSS）可以很容易地适用于外观和新的设计趋势，在短短的几分钟内大连网站建设的经验，当你使用一些片段。片段是用来增加功能，为用户提供更好的体验，但以下的处理严格与你网站的美学。每一个都将帮助你保持新的潮流和哇你的访客。

平面菜单

平面设计是所有愤怒的日子里。这一段，你可以建立一个扁平的导航菜单，使用图标，但是当选定的页面的名字出现在右边的菜单和：

nav ul {

list-style: none; overflow: hidden; position: relative;

}nav ul li {
}float: left; margin: 0 20px 0 0;
nav ul li a {
display: block; width: 120px; height: 120px;
background-image:url(icons.png);background-repeat:no-repeat;
}nav ul li:nth-child(1) a {
background-color: #5bb2fc;
background-position: 28px 28px;
}nav ul li:nth-child(2) a {
background-color: #58ebd3;
background-position: 28px -96px;
}nav ul li:nth-child(3) a {
background-color: #ffa659;
background-position: 28px -222px;
}nav ul li:nth-child(4) a {
background-color: #ff7a85;
background-position: 28px -342px;
}nav ul li a span {
font: 50px "Dosis", sans-serif;
text-transform: uppercase;
top: 29px;
position: absolute; left: 580px;
display: none;
}nav ul li a:hover span {
}nav ul li:nth-child(1) a span {
color: #5bb2fc;
}nav ul li:nth-child(2) a span {
color: #58ebd3;
}nav ul li:nth-child(3) a span {
color: #ffa659;
}nav ul li:nth-child(4) a span {
color: #ff7a85;
}