css布局实现手机端移动端外卖点餐购物车页面效果代码
代码语言:html
所属分类:布局界面
代码描述:css布局实现手机端移动端外卖点餐购物车页面效果代码
代码标签: 手机 端 移动 端外 卖点 餐 购物车 页面 效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html class="js cssanimations">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp">
<style type="text/css">
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
font-family: "微软雅黑","microsoft yahei",helvetica;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
a {
color: #333;
text-decoration: none;
outline: none
}
a:hover {
color: #090
}
/*Clear Float*/
.clearfix:after,.w1:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix,.w {
*+height: 1%
}
input[type="button"], input[type="submit"], input[type="reset"] {
-webkit-appearance: none;
}
textarea {
-webkit-appearance: none;
}
img {
width: 100%;
}
html,body {
height: 100%;
font-family: -apple-system-font,"Helvetica Neue", sans-serif;
font-size: 12px;
}
a,button,input,button,span,div {
-webkit-tap-highlight-color: rgba(255,0,0,0);
}
.header {
position: relative;
height: auto;
overflow: hidden;
color: #fff;
background: rgba(7,17,27,0.5);
background: url(//repo.bfw.wiki/bfwrepo/image/6085224b78e79.png) no-repeat;
background-size: cover;
}
.header .leftlogo {
width: 80px;
height: 80px;
border-radius: 5px;
float: left;
margin: 25px 20px 18px 30px;
background: url(//repo.bfw.wiki/bfwrepo/image/60665075e0765.png) no-repeat;
background-size: contain;
}
.header .righttitle {
float: left;
margin: 30px 0 0 0;
color: #FFF;
}
.header .righttitle h1 {
font-size: 20px;
font-weight: bold;
}
.header .righttitle h2 {
width: 200px;
font-size: 14px;
margin: 10px 0 0 0;
line-height: 20px;
}
.header .bulletin {
position: relative;
width: 94%;
height.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0