2597 lines
44 KiB
CSS
2597 lines
44 KiB
CSS
|
||
/**
|
||
*
|
||
* master.less
|
||
*
|
||
* 样式主文件
|
||
* 包含基础样式、公共样式、组件初始化以及定制样式等
|
||
*
|
||
* version 1.0.0.0(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author pye-mail@163.com
|
||
*
|
||
* create log 2015年6月12日14:15:37
|
||
*
|
||
* last update 无
|
||
*
|
||
*/
|
||
/**
|
||
*
|
||
* _bass.less
|
||
*
|
||
* 基础样式
|
||
* 基础样式是对元素样式的初始化，有的也叫做reset.css(重置样式)，比如我们要去掉链接的下划线、我们要去掉列表前的圆点符号、我们需要让body没有间隙、我们还需要设置body下的默认字体，大小和颜色等等
|
||
*
|
||
* version 1.0.0.0(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author pye-mail@163.com
|
||
*
|
||
* create log 2015年2月6日13:46:12
|
||
*
|
||
* last update 无
|
||
*
|
||
*/
|
||
html {
|
||
font-size: 62.5%;
|
||
}
|
||
html,
|
||
body
|
||
{
|
||
|
||
font-family: "\9ED1\4F53";
|
||
/* 黑体 \9ED1\4F53
|
||
宋体 \5B8B\4F53
|
||
楷体 \6977\4F53
|
||
微软雅黑 \5FAE\8F6F\96C5\9ED1
|
||
*/
|
||
line-height: 1.5;
|
||
overflow-x: hidden;
|
||
}
|
||
body,
|
||
dl,
|
||
dt,
|
||
dd,
|
||
ul,
|
||
ol,
|
||
li,
|
||
h1,
|
||
h2,
|
||
h3,
|
||
h4,
|
||
h5,
|
||
h6,
|
||
pre,
|
||
code,
|
||
form,
|
||
fieldset,
|
||
legend,
|
||
input,
|
||
textarea,
|
||
p,
|
||
blockquote,
|
||
table,
|
||
th,
|
||
td,
|
||
tr,
|
||
hr,
|
||
button,
|
||
article,
|
||
aside,
|
||
details,
|
||
figcaption,
|
||
figure,
|
||
footer,
|
||
header,
|
||
hgroup,
|
||
menu,
|
||
nav,
|
||
section {
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
/* 纠正 IE 6/7/8/9 和 Firefox 3 中未定义的 `block` 元素显示*/
|
||
article,
|
||
aside,
|
||
details,
|
||
figcaption,
|
||
figure,
|
||
footer,
|
||
header,
|
||
hgroup,
|
||
main,
|
||
nav,
|
||
section,
|
||
summary {
|
||
display: block;
|
||
}
|
||
/* 校正 Firefox 3+， Safari 4/5 和 Chrome 中 `bolder` 的样式*/
|
||
b,
|
||
strong {
|
||
font-weight: bold;
|
||
}
|
||
/*1、统一边框样式，但textarea和select边框得不到改变
|
||
*2、去掉谷歌浏览器上文本框和按钮的焦点边框，但去不了textarea和select的焦点边框；
|
||
* 去掉ie浏览器上按钮的焦点边框；
|
||
*/
|
||
input,
|
||
select,
|
||
textarea,
|
||
button {
|
||
border: 1px solid;
|
||
/* 1 */
|
||
outline: 0;
|
||
/* 2 */
|
||
}
|
||
/**
|
||
* 1、兼容IE浏览器，使它们在没有超出文本范围时不出现滚动条
|
||
*/
|
||
textarea {
|
||
overflow: auto;
|
||
/* 1 */
|
||
resize: none;
|
||
/*不允许调整大小*/
|
||
}
|
||
/**给input元素设置合理的行间距*/
|
||
input {
|
||
line-height: normal;
|
||
}
|
||
/**可作为按钮的元素显示为“按钮”样子，当鼠标放在上面的时候，呈现手的样子。*/
|
||
button,
|
||
input[type="button"],
|
||
input[type="reset"],
|
||
input[type="submit"] {
|
||
-webkit-appearance: button;
|
||
cursor: pointer;
|
||
}
|
||
/**当按钮为禁用按钮时,鼠标变为默认状态.当文本框或文本域是只读的时候，鼠标显示为默认状态。 */
|
||
input[disabled],
|
||
button[disabled],
|
||
input[readonly],
|
||
textarea[readonly] {
|
||
cursor: default;
|
||
}
|
||
/*解决焦点粗虚线框的问题,对于button在Firefox下虚线框的特有方法*/
|
||
button::-moz-focus-inner,
|
||
input::-moz-focus-inner {
|
||
border: 0;
|
||
padding: 0;
|
||
}
|
||
/**
|
||
* 1、校正 IE 8/9 中 box sizing 被设置为 `content-box`(cs2.1规定的，宽度和高度分别应用到元素的内容框) 的问题
|
||
* 2、删除 IE 8/9 中多余的内边距
|
||
* 3、删除 IE 7 中多余的内边距
|
||
* 已知问题：在 IE 6 中仍然存在多余的内边距
|
||
*/
|
||
input[type="checkbox"],
|
||
input[type="radio"] {
|
||
box-sizing: border-box;
|
||
/* 1 */
|
||
padding: 0;
|
||
/* 2 */
|
||
*height: 13px;
|
||
/* 3 */
|
||
*width: 13px;
|
||
/* 3 */
|
||
}
|
||
/**解决组合选项标题不能加粗*/
|
||
optgroup {
|
||
font-weight: bold;
|
||
}
|
||
/* 删除单元格间大部分的间距，边框合并为单一边框。*/
|
||
table {
|
||
border-collapse: collapse;
|
||
border-spacing: 0;
|
||
empty-cells: show;
|
||
}
|
||
fieldset,
|
||
img {
|
||
border: 0;
|
||
}
|
||
iframe {
|
||
display: block;
|
||
height: 100%;
|
||
width: 100%;
|
||
border: 0;
|
||
}
|
||
/**初始化ol ul的属性，使之不显示列表序号。*/
|
||
ol,
|
||
ul {
|
||
list-style: none;
|
||
}
|
||
ins,
|
||
a {
|
||
text-decoration: none;
|
||
outline: 0;
|
||
}
|
||
ins:active,
|
||
a:active,
|
||
ins:hover,
|
||
a:hover {
|
||
outline: 0;
|
||
}
|
||
/* 清除特殊标记的字体和字号 */
|
||
address,
|
||
caption,
|
||
cite,
|
||
code,
|
||
em,
|
||
strong,
|
||
th,
|
||
var {
|
||
font-weight: normal;
|
||
font-style: normal;
|
||
}
|
||
.clear
|
||
{
|
||
height:0;
|
||
clear:both;
|
||
}
|
||
/**
|
||
*
|
||
* _common.less
|
||
*
|
||
* 公共样式
|
||
* 公共样式是对元素的修饰和补充，主要包括字体、字体大小、字体颜色、(内外)间距、(清除)浮动、公共图标、(常用)元素大小(宽高、行高)
|
||
* 文本对齐方式(水平、垂直)、缩进、下划线、边框等样式的设置
|
||
*
|
||
* version 1.2.0.2(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author pye-mail@163.com
|
||
*
|
||
* create log 2015年2月26日15:18:18
|
||
*
|
||
* last update 2015年3月4日10:13:23
|
||
*
|
||
*/
|
||
/**
|
||
*
|
||
* _mixin.less
|
||
*
|
||
* Less公共函数
|
||
* 浮动、大小、边框、色彩、旋转、翻转等效果设置的公共方法。
|
||
* 理论上，任何一段样式代码在重复使用两次以上的，我们都可以把它封装成一个方法，
|
||
* 为了避免盲目的封装方法，则需要判断此段代码是否带有一定的逻辑性和复杂性，如果是一段普通的代码，则没有必要封装为方法
|
||
*
|
||
* version 1.2.3.3(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author pye-mail@163.com
|
||
*
|
||
* create log 2015年2月6日13:39:05
|
||
*
|
||
* last update 2015年6月6日17:16:46
|
||
*
|
||
*/
|
||
/**
|
||
* 清除浮动
|
||
* @remark clearfix 主要是用在浮动层的父层，而 clear 主要是用在浮动层与浮动层之间，和浮动层同一级
|
||
*/
|
||
/**
|
||
* 背景图标
|
||
* @path: 背景图标路径，不包括后缀名
|
||
* @width: 图标元素宽度
|
||
* @height: 图标元素高度
|
||
*/
|
||
/**
|
||
* 指定该盒子的大小包括边框的宽度(IE兼容性 IE8+)
|
||
* @box-type: content-box|border-box|inherit
|
||
*/
|
||
/**
|
||
* 盒模型
|
||
*/
|
||
/**
|
||
* 盒模型所占比例(比如：我们现在有三列，如果让这三列平均分配宽度，那么每一列的box-flex值就为1；如果第一列为1，第二列为1，第三列为2，那么第三列的宽度就应该是第一、二列的两倍)
|
||
* 此处相对于box-orient的设置，如果box-orient的设置为水平排列，这里则按照宽度等比划分，如果为垂直排列，则按照高度等比排列
|
||
* @value 比例值，默认为1
|
||
*/
|
||
/**
|
||
* 盒模型子容器排列方式
|
||
* @type 排列方式(horizontal | vertical | inline-axis | block-axis | inherit)，默认为'horizontal'水平排列
|
||
*/
|
||
/**
|
||
* 元素的浮动
|
||
* @float 浮动方向(left,right)
|
||
*/
|
||
/**
|
||
* 块元素居中
|
||
*/
|
||
/**
|
||
* 将元素转换为行级块元素
|
||
*/
|
||
/**
|
||
* 占位符placeholder样式设置
|
||
* @color 字体颜色
|
||
* @font-size 字体大小
|
||
* @font-family 字体
|
||
*/
|
||
/**
|
||
* 元素大小设置
|
||
* @width 宽度
|
||
* @height 高度
|
||
* @remark 一个参数时表示设置宽度；两个参数时表示分别设置宽度和高度
|
||
*/
|
||
/**
|
||
* 元素行高设置
|
||
* @lineHeight 行高
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 文本(水平)对齐方式
|
||
* @align 对齐方式(left[默认]、center、right)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* (垂直)对齐方式
|
||
* @vertical-align 对齐方式(top[默认]、middle、bottom、baseline)
|
||
* @remark baseline.基线对齐
|
||
*/
|
||
/**
|
||
* 文本缩进
|
||
* @text-indent 缩进值
|
||
* @remark 默认为2em
|
||
*/
|
||
/**
|
||
* 文本划线
|
||
* @line-type 划线类型(overline.顶划线 through.中划线 underline.下划线[默认])
|
||
* @remark 默认为2em
|
||
*/
|
||
/**
|
||
* 定义字体
|
||
* @font-family 字体
|
||
* @remark 默认为'微软雅黑'
|
||
*/
|
||
/**
|
||
* 定义字体大小
|
||
* @font-size 字体大小
|
||
* @remark 默认为'12px'
|
||
*/
|
||
/**
|
||
* 定义字体颜色
|
||
* @color 字体颜色
|
||
* @remark 默认为'#fff'
|
||
*/
|
||
/**
|
||
* 定义字体级别
|
||
* @font-weight 字体粗细级别
|
||
* @remark 默认为'normal'
|
||
*/
|
||
/**
|
||
* 定义元素定位
|
||
* @type 定位类型
|
||
* @remark 默认为'initial'
|
||
*/
|
||
/**
|
||
* 定义边框大小
|
||
* @border-width 边框宽度
|
||
* @direction 设置边框方向
|
||
* @remark 边框宽度默认为'1px'，设置边框方向默认为所有：'all'
|
||
*/
|
||
/**
|
||
* 定义边框类型
|
||
* @border-style 边框类型
|
||
* @direction 设置边框方向
|
||
* @remark 边框类型默认为'solid'，设置边框方向默认为所有：'all'
|
||
*/
|
||
/**
|
||
* 定义边框颜色
|
||
* @border-color 边框颜色
|
||
* @direction 设置边框方向
|
||
* @remark 边框颜色默认为'#000'，设置边框方向默认为所有：'all'
|
||
*/
|
||
/**
|
||
* 定义间距(外边距)
|
||
* @margin 边距值
|
||
* @direction 设置边距方向
|
||
* @remark 边距值默认为'5px'，设置边距方向默认为所有：'all'
|
||
*/
|
||
/**
|
||
* 定义间距(内边距)
|
||
* @padding 边距值
|
||
* @direction 设置边距方向
|
||
* @remark 边距值默认为'5px'，设置边距方向默认为所有：'all'
|
||
*/
|
||
/**
|
||
* Table 表格行hover设置
|
||
* @background 行初始背景
|
||
* @background-hover 行hover背景
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 文本超出用"..."代替
|
||
* @remark 需要设置元素为block或inline-block
|
||
*/
|
||
/**
|
||
* 文本居中
|
||
* @line-height 行高
|
||
* @remark 设置文本上下左右居中，需提供元素行高
|
||
*/
|
||
/**
|
||
* 自动换行
|
||
* @mode CSS4新属性参数，none | manual | auto
|
||
*/
|
||
/**
|
||
* 元素透明度
|
||
* @opacity 透明度(0~1之间)
|
||
*/
|
||
/**
|
||
* input框定义
|
||
* @font-color 字体颜色
|
||
* @background 背景颜色
|
||
* @border-color 边框颜色
|
||
*/
|
||
/**
|
||
* Retina Images
|
||
* @remark -webkit-min-device-pixel-ratio的常见值对照:
|
||
* ==========-webkit-min-device-pixel-ratio为1.0==========
|
||
* 所有非Retina的Mac
|
||
* 所有非Retina的iOS设备
|
||
* Acer Iconia A500
|
||
* Samsung Galaxy Tab 10.1
|
||
* Samsung Galaxy S
|
||
* ==========-webkit-min-device-pixel-ratio为1.3==========
|
||
* Google Nexus 7
|
||
* ==========-webkit-min-device-pixel-ratio为1.5==========
|
||
* Google Nexus S
|
||
* Samsung Galaxy S II
|
||
* HTC Desire
|
||
* HTC Desire HD
|
||
* HTC Incredible S
|
||
* HTC Velocity
|
||
* HTC Sensation
|
||
* ==========-webkit-min-device-pixel-ratio为2.0==========
|
||
* iPhone 4
|
||
* iPhone 4S
|
||
* iPhone 5
|
||
* iPad (3rd generation)
|
||
* iPad 4
|
||
* 所有Retina displays 的MAC
|
||
* Google Galaxy Nexus
|
||
* Google Nexus 4
|
||
* Google Nexus 10
|
||
* Samsung Galaxy S III
|
||
* Samsung Galaxy Note II
|
||
* Sony Xperia S
|
||
* HTC One X
|
||
*/
|
||
/**
|
||
* 圆角 单边框 Top
|
||
* @radius 圆角值
|
||
*/
|
||
/**
|
||
* 圆角 单边框 Right
|
||
* @radius 圆角值
|
||
*/
|
||
/**
|
||
* 圆角 单边框 Bottom
|
||
* @radius 圆角值
|
||
*/
|
||
/**
|
||
* 圆角 单边框 Left
|
||
* @radius 圆角值
|
||
*/
|
||
/**
|
||
* 圆角
|
||
* @radius 圆角值
|
||
*/
|
||
/**
|
||
* 元素阴影
|
||
* @shadow (h-shadow v-shadow blur spread color inset)
|
||
* h-shadow:必需。水平阴影的位置。允许负值。
|
||
* v-shadow:必需。垂直阴影的位置。允许负值。
|
||
* blur :可选。模糊距离。
|
||
* spread :可选。阴影的尺寸。
|
||
* color :可选。阴影的颜色。请参阅 CSS 颜色值。
|
||
* inset :可选。将外部阴影 (outset) 改为内部阴影。
|
||
*/
|
||
/**
|
||
* 文本阴影
|
||
* @shadow (h-shadow v-shadow blur color)
|
||
* h-shadow:必需。水平阴影的位置。允许负值。
|
||
* v-shadow:必需。垂直阴影的位置。允许负值。
|
||
* blur :可选。模糊距离。
|
||
* color :可选。阴影的颜色。请参阅 CSS 颜色值。
|
||
*/
|
||
/**
|
||
* 效果过度
|
||
* @shadow (property duration timing-function delay)
|
||
* property :规定设置过渡效果的 CSS 属性的名称。
|
||
* duration :规定完成过渡效果需要多少秒或毫秒。
|
||
* timing-function:规定速度效果的速度曲线。
|
||
* delay :定义过渡效果何时开始。
|
||
*/
|
||
/**
|
||
* 旋转(2D)
|
||
* @degrees 旋转度数
|
||
* @remark 为正数时，顺时针旋转；为负数时，逆时针旋转
|
||
*/
|
||
/**
|
||
* 旋转(3D)
|
||
* @degrees 旋转度数
|
||
* @remark 为正数时，顺时针旋转；为负数时，逆时针旋转;
|
||
* 经测试，rotate3d并无效果，且rotateX、rotateY、rotateZ需单独使用才有效果
|
||
*/
|
||
/**
|
||
* 倾斜
|
||
* @skew X、Y轴倾斜度数
|
||
* @remark 同时设置X、Y轴倾斜度数
|
||
*/
|
||
/**
|
||
* 倾斜
|
||
* @x X轴倾斜度数
|
||
* @y Y轴倾斜度数
|
||
* @remark 一个参数时表示设置X轴；两个参数时表示分别设置X、Y轴
|
||
*/
|
||
/**
|
||
* 比例
|
||
* @scale X、Y轴缩放比例
|
||
* @remark 同时设置X、Y轴缩放比例
|
||
*/
|
||
/**
|
||
* 比例
|
||
* @x X轴缩放比例
|
||
* @y Y轴缩放比例
|
||
* @remark 缩放，1为原始大小；正数放大，负数缩小；一个参数时表示X、Y轴同时设置；两个参数时表示分别设置X、Y轴
|
||
*/
|
||
/**
|
||
* 比例(3d)
|
||
* @scale X、Y、Z轴缩放比例
|
||
* @remark 同时设置X、Y、Z轴缩放比例
|
||
*/
|
||
/**
|
||
* 比例
|
||
* @x X轴缩放比例
|
||
* @y Y轴缩放比例
|
||
* @remark 缩放，1为原始大小；正数放大，负数缩小；一个参数时表示X、Y轴同时设置；两个参数时表示分别设置X、Y轴
|
||
*/
|
||
/**
|
||
* (位置)变动，位移
|
||
* @translate X轴位置、Y轴位置
|
||
* @remark 同时设置X、Y轴位移位置
|
||
*/
|
||
/**
|
||
* (位置)变动，位移
|
||
* @x X轴位置
|
||
* @y Y轴位置
|
||
* @remark 一个参数时表示设置X轴；两个参数时表示分别设置X、Y轴
|
||
*/
|
||
/**
|
||
* 3D(位置)变动，位移
|
||
* @translate3d X、Y、Z轴位置
|
||
* @remark 同时设置X、Y轴、Z轴位移位置
|
||
*/
|
||
/**
|
||
* 3D(位置)变动，位移
|
||
* @x X轴位置
|
||
* @y Y轴位置
|
||
* @z Z轴位置
|
||
* @remark 一个参数时表示设置X轴；两个参数时表示分别设置X、Y轴；三个参数时表示分别设置X、Y、Z轴
|
||
*/
|
||
/**
|
||
* 动画(自定义所有参数及格式)
|
||
* @animation 动画参数
|
||
* @remark 默认值：all .2s ease 0 1 normal(规定需要绑定到选择器的 keyframe 名称、规定完成动画所花费的时间，以秒或毫秒计、规定动画的速度曲线、规定在动画开始之前的延迟、规定动画应该播放的次数、规定是否应该轮流反向播放动画)
|
||
*/
|
||
/**
|
||
* 动画(常用设置)
|
||
* @name 动画名称(默认值：animation)
|
||
* @time 动画时间(默认值：.2s)
|
||
* @timing 动画速度曲线(默认值：ease)
|
||
* @count 播放次数(默认值：1)
|
||
* @remark
|
||
*/
|
||
/**
|
||
* 动画名称设置
|
||
* @name 动画名称
|
||
* @remark keyframename|none(规定需要绑定到选择器的 keyframe 的名称|规定无动画效果（可用于覆盖来自级联的动画）)
|
||
*/
|
||
/**
|
||
* 动画时间设置
|
||
* @time 动画时间
|
||
* @remark time(规定完成动画所花费的时间。默认值是 1s)
|
||
*/
|
||
/**
|
||
* 动画速度曲线设置
|
||
* @timing 动画速度曲线类型
|
||
* @remark linear|ease|ease-in|ease-out|ease-in-out(直线匀速|以低速开始，然后加快，在结束前变慢|以低速开始|以低速结束|以低速开始和结束)
|
||
*/
|
||
/**
|
||
* 定义动画何时开始
|
||
* @time 动画开始时间(以秒或毫秒计)
|
||
* @remark time(可选。定义动画开始前等待的时间，以秒或毫秒计。默认值是 0)
|
||
*/
|
||
/**
|
||
* 动画的播放次数
|
||
* @count 次数
|
||
* @remark n|infinite(定义动画播放次数的数值|规定动画应该无限次播放。默认值是 1)
|
||
*/
|
||
/**
|
||
* 定义动画是否应该轮流反向播放
|
||
* @direction 参数
|
||
* @remark normal|alternate(默认值。动画应该正常播放|动画应该轮流反向播放)
|
||
*/
|
||
/**
|
||
* 定义动画暂停和播放
|
||
* @play 暂停/播放
|
||
* @remark paused|running(规定动画暂停|规定动画播放。默认值为 paused)
|
||
*/
|
||
/**
|
||
* 规定填充模式
|
||
* @mode 模式
|
||
* @remark none|forwards|backwards|both(不改变默认行为|动画完成后，保持最后一个属性值（在最后一个关键帧中定义）|在 animation-delay 所指定的一段时间内，在动画显示之前，应用开始属性值（在第一个关键帧中定义）|向前和向后填充模式都被应用。默认值为 forwards)
|
||
*/
|
||
/**
|
||
* 定义当元素不面向屏幕时是否可见
|
||
* @visibility 类型
|
||
* @remark visible|hidden(背面可见|背面不可见。默认值为 hidden)
|
||
*/
|
||
/**
|
||
*
|
||
* @column-count 将内容分为多少列
|
||
* @column-gap 列间距
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 设置或检索对象的区域是否允许用户缩放，调节元素尺寸大小
|
||
* @direction 类型
|
||
* @remark none|both|horizontal|vertical(不允许用户调整元素大小|用户可以调节元素的宽度和高度|用户可以调节元素的宽度|用户可以调节元素的高度)
|
||
*/
|
||
/* Horizontal gradient, from left to right（水平渐变，从左到右） */
|
||
/* Vertical gradient, from top to bottom （垂直渐变，从上到下）*/
|
||
/**
|
||
* 橡皮筋动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 凝胶物(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 弹跳动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 闪烁动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 旋转动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 信号波动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 摇摆动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 脉冲动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 翻转(Y)动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 翻转(X)动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 翻转(X)动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 翻转(Y)动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 券进动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 出现动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 出现动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* 消失动画(关键帧)
|
||
* @remark 无
|
||
*/
|
||
/**
|
||
* (普通、组件)图标
|
||
* @remark 无
|
||
*/
|
||
*{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
|
||
.icon {
|
||
display: inline-block;
|
||
*display: inline;
|
||
*zoom: 1;
|
||
height: 20px;
|
||
width: 20px;
|
||
background: url(s-icon.png) no-repeat 0 0;
|
||
_background: url(s-icon.gif) no-repeat 0 0;
|
||
}
|
||
/**
|
||
* 浮动
|
||
* @remark 无
|
||
*/
|
||
.fn-left {
|
||
float: left;
|
||
display: inline;
|
||
}
|
||
.fn-right {
|
||
float: right;
|
||
display: inline;
|
||
}
|
||
/**
|
||
* 清除浮动
|
||
* @remark clearfix 主要是用在浮动层的父层，而 clear 主要是用在浮动层与浮动层之间，和浮动层同一级
|
||
*/
|
||
.fn-clear {
|
||
*zoom: 1;
|
||
clear: both;
|
||
display: block;
|
||
/*font-size: 0;height: 0;line-height: 0;visibility: hidden;*/
|
||
}
|
||
.fn-clearfix {
|
||
*zoom: 1;
|
||
}
|
||
.fn-clearfix:before,
|
||
.fn-clearfix:after {
|
||
content: "";
|
||
display: block;
|
||
}
|
||
.fn-clearfix:after {
|
||
clear: both;
|
||
font-size: 0;
|
||
height: 0;
|
||
line-height: 0;
|
||
visibility: hidden;
|
||
}
|
||
/**
|
||
* 显示、隐藏
|
||
* @remark 无
|
||
*/
|
||
.fn-show {
|
||
visibility: visible;
|
||
display: block;
|
||
}
|
||
.fn-hide {
|
||
visibility: hidden;
|
||
display: none;
|
||
}
|
||
/**
|
||
* 人民币文字样式
|
||
* @remark 无
|
||
*/
|
||
.fn-rmb {
|
||
font-family: Verdana;
|
||
font-size: 14px;
|
||
}
|
||
/**
|
||
* 定义元素定位
|
||
* @remark 无
|
||
*/
|
||
.fn-pos-abs {
|
||
position: initial;
|
||
}
|
||
.fn-pos-rel {
|
||
position: initial;
|
||
}
|
||
/**
|
||
* 文本超出用"..."代替
|
||
* @remark 无
|
||
*/
|
||
fn-txt-overflow {
|
||
-webkit-text-overflow: ellipsis;
|
||
-khtml-text-overflow: ellipsis;
|
||
-icab-text-overflow: ellipsis;
|
||
-moz-text-overflow: ellipsis;
|
||
-o-text-overflow: ellipsis;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
}
|
||
/**
|
||
* 包装，包裹(wrap)
|
||
* @remark 无
|
||
*/
|
||
.wp-960 {
|
||
width: 960px;
|
||
margin: 0 auto;
|
||
}
|
||
.wp-980 {
|
||
width: 980px;
|
||
margin: 0 auto;
|
||
}
|
||
.wp-1000 {
|
||
width: 1000px;
|
||
margin: 0 auto;
|
||
}
|
||
.wp-1024 {
|
||
width: 1024px;
|
||
margin: 0 auto;
|
||
}
|
||
.wp-1190 {
|
||
width: 1190px;
|
||
margin: 0 auto;
|
||
}
|
||
.wp-1200 {
|
||
width: 1200px;
|
||
margin: 0 auto;
|
||
}
|
||
/**
|
||
* 宽度定义(width)
|
||
* @remark 无
|
||
*/
|
||
.w-10 {
|
||
width: 10px;
|
||
}
|
||
.w-20 {
|
||
width: 20px;
|
||
}
|
||
.w-30 {
|
||
width: 30px;
|
||
}
|
||
.w-50 {
|
||
width: 50px;
|
||
}
|
||
.w-80 {
|
||
width: 80px;
|
||
}
|
||
.w-100 {
|
||
width: 100px;
|
||
}
|
||
.w-120 {
|
||
width: 120px;
|
||
}
|
||
.w-180 {
|
||
width: 180px;
|
||
}
|
||
.w-200 {
|
||
width: 200px;
|
||
}
|
||
/**
|
||
* 高度定义(height)
|
||
* @remark 无
|
||
*/
|
||
.h-10 {
|
||
height: 10px;
|
||
}
|
||
.h-20 {
|
||
height: 20px;
|
||
}
|
||
.h-30 {
|
||
height: 30px;
|
||
}
|
||
.h-50 {
|
||
height: 50px;
|
||
}
|
||
.h-80 {
|
||
height: 80px;
|
||
}
|
||
.h-100 {
|
||
height: 100px;
|
||
}
|
||
.h-120 {
|
||
height: 120px;
|
||
}
|
||
.h-180 {
|
||
height: 180px;
|
||
}
|
||
.h-200 {
|
||
height: 200px;
|
||
}
|
||
/**
|
||
* 行高定义(line-height)
|
||
* @remark 最小行高12px
|
||
*/
|
||
.lh-12 {
|
||
line-height: 12px;
|
||
}
|
||
.lh-14 {
|
||
line-height: 14px;
|
||
}
|
||
.lh-16 {
|
||
line-height: 16px;
|
||
}
|
||
.lh-18 {
|
||
line-height: 18px;
|
||
}
|
||
.lh-24 {
|
||
line-height: 24px;
|
||
}
|
||
.lh-28 {
|
||
line-height: 28px;
|
||
}
|
||
/**
|
||
* 文本(水平)对齐方式(text-align)
|
||
* @remark 无
|
||
*/
|
||
.txt-l {
|
||
text-align: left;
|
||
}
|
||
.txt-c {
|
||
text-align: center;
|
||
}
|
||
.txt-r {
|
||
text-align: right;
|
||
}
|
||
/**
|
||
* (垂直)对齐方式(vertical-align)
|
||
* @remark 无
|
||
*/
|
||
.txt-t {
|
||
vertical-align: top;
|
||
}
|
||
.txt-m {
|
||
vertical-align: middle;
|
||
}
|
||
.txt-b {
|
||
vertical-align: bottom;
|
||
}
|
||
.txt-bl {
|
||
vertical-align: baseline;
|
||
}
|
||
/**
|
||
* 文本缩进(text-indent)
|
||
* @remark 无
|
||
*/
|
||
.txt-in {
|
||
text-indent: 2em;
|
||
}
|
||
.txt-in1 {
|
||
text-indent: 1em;
|
||
}
|
||
.txt-in4 {
|
||
text-indent: 4em;
|
||
}
|
||
.txt-in6 {
|
||
text-indent: 6em;
|
||
}
|
||
/**
|
||
* 文本划线(text-decoration)
|
||
* @remark 无
|
||
*/
|
||
.txt-unline {
|
||
text-decoration: none;
|
||
}
|
||
.txt-underline {
|
||
text-decoration: underline;
|
||
}
|
||
.txt-overline {
|
||
text-decoration: overline;
|
||
}
|
||
.txt-through {
|
||
text-decoration: line-through;
|
||
}
|
||
/**
|
||
* 定义字体(font-family)
|
||
* @remark 无
|
||
*/
|
||
.fm-yh {
|
||
font-family: '微软雅黑';
|
||
}
|
||
.fm-arial {
|
||
font-family: 'arial';
|
||
}
|
||
.fm-kt {
|
||
font-family: '楷体';
|
||
}
|
||
.fm-ht {
|
||
font-family: '黑体';
|
||
}
|
||
/**
|
||
* 定义字体大小(font-size)
|
||
* @remark 无
|
||
*/
|
||
.fs-10 {
|
||
font-size: 10px;
|
||
}
|
||
.fs-12 {
|
||
font-size: 12px;
|
||
}
|
||
.fs-14 {
|
||
font-size: 14px;
|
||
}
|
||
.fs-16 {
|
||
font-size: 16px;
|
||
}
|
||
.fs-18 {
|
||
font-size: 18px;
|
||
}
|
||
.fs-20 {
|
||
font-size: 20px;
|
||
}
|
||
.fs-24 {
|
||
font-size: 24px;
|
||
}
|
||
/**
|
||
* 定义字体颜色(font-color)
|
||
* @remark 无
|
||
*/
|
||
.fc-red {
|
||
color: #ff0000;
|
||
}
|
||
.fc-blue {
|
||
color: #5599ff;
|
||
}
|
||
.fc-green {
|
||
font-size: #227700;
|
||
}
|
||
.fc-yellow {
|
||
color: #ffff00;
|
||
}
|
||
.fc-white {
|
||
color: #ffffff;
|
||
}
|
||
.fc-black {
|
||
color: #000000;
|
||
}
|
||
.fc-gray {
|
||
color: #cccccc;
|
||
}
|
||
/**
|
||
* 定义字体级别(font-weight)
|
||
* @remark 无
|
||
*/
|
||
.fw-bold {
|
||
font-weight: bold;
|
||
}
|
||
.fw-nomal {
|
||
font-weight: normal;
|
||
}
|
||
/**
|
||
* 定义无边框
|
||
* @remark 无
|
||
*/
|
||
.nobt {
|
||
border-top-style: none;
|
||
}
|
||
.nobr {
|
||
border-right-style: none;
|
||
}
|
||
.nobb {
|
||
border-bottom-style: none;
|
||
}
|
||
.nobl {
|
||
border-left-style: none;
|
||
}
|
||
/**
|
||
* 定义边框宽度
|
||
* @remark 无
|
||
*/
|
||
.bw-1 {
|
||
border-width: 1px;
|
||
}
|
||
.bw-2 {
|
||
border-width: 2px;
|
||
}
|
||
.bw-3 {
|
||
border-width: 3px;
|
||
}
|
||
.bw-4 {
|
||
border-width: 4px;
|
||
}
|
||
.bw-5 {
|
||
border-width: 5px;
|
||
}
|
||
.btw-1 {
|
||
border-top-width: 1px;
|
||
}
|
||
.btw-2 {
|
||
border-top-width: 2px;
|
||
}
|
||
.btw-3 {
|
||
border-top-width: 3px;
|
||
}
|
||
.btw-4 {
|
||
border-top-width: 4px;
|
||
}
|
||
.btw-5 {
|
||
border-top-width: 5px;
|
||
}
|
||
.brw-1 {
|
||
border-right-width: 1px;
|
||
}
|
||
.brw-2 {
|
||
border-right-width: 2px;
|
||
}
|
||
.brw-3 {
|
||
border-right-width: 3px;
|
||
}
|
||
.brw-4 {
|
||
border-right-width: 4px;
|
||
}
|
||
.brw-5 {
|
||
border-right-width: 5px;
|
||
}
|
||
.bbw-1 {
|
||
border-bottom-width: 1px;
|
||
}
|
||
.bbw-2 {
|
||
border-bottom-width: 2px;
|
||
}
|
||
.bbw-3 {
|
||
border-bottom-width: 3px;
|
||
}
|
||
.bbw-4 {
|
||
border-bottom-width: 4px;
|
||
}
|
||
.bbw-5 {
|
||
border-bottom-width: 5px;
|
||
}
|
||
.blw-1 {
|
||
border-left-width: 1px;
|
||
}
|
||
.blw-2 {
|
||
border-left-width: 2px;
|
||
}
|
||
.blw-3 {
|
||
border-left-width: 3px;
|
||
}
|
||
.blw-4 {
|
||
border-left-width: 4px;
|
||
}
|
||
.blw-5 {
|
||
border-left-width: 5px;
|
||
}
|
||
/**
|
||
* 定义无(外)边距
|
||
* @remark 无
|
||
*/
|
||
.nomt {
|
||
margin-top: auto;
|
||
}
|
||
.nomr {
|
||
margin-right: auto;
|
||
}
|
||
.nomb {
|
||
margin-bottom: auto;
|
||
}
|
||
.noml {
|
||
margin-left: auto;
|
||
}
|
||
/**
|
||
* 定义(外)边距
|
||
* @remark 无
|
||
*/
|
||
.m-5 {
|
||
margin: 5px;
|
||
}
|
||
.m-10 {
|
||
margin: 10px;
|
||
}
|
||
.m-15 {
|
||
margin: 15px;
|
||
}
|
||
.m-20 {
|
||
margin: 20px;
|
||
}
|
||
.m-25 {
|
||
margin: 25px;
|
||
}
|
||
.m-30 {
|
||
margin: 30px;
|
||
}
|
||
.mt-5 {
|
||
margin-top: 5px;
|
||
}
|
||
.mt-10 {
|
||
margin-top: 10px;
|
||
}
|
||
.mt-15 {
|
||
margin-top: 15px;
|
||
}
|
||
.mt-20 {
|
||
margin-top: 20px;
|
||
}
|
||
.mt-25 {
|
||
margin-top: 25px;
|
||
}
|
||
.mt-30 {
|
||
margin-top: 30px;
|
||
}
|
||
.mr-5 {
|
||
margin-right: 5px;
|
||
}
|
||
.mr-10 {
|
||
margin-right: 10px;
|
||
}
|
||
.mr-15 {
|
||
margin-right: 15px;
|
||
}
|
||
.mr-20 {
|
||
margin-right: 20px;
|
||
}
|
||
.mr-25 {
|
||
margin-right: 25px;
|
||
}
|
||
.mr-30 {
|
||
margin-right: 30px;
|
||
}
|
||
.mb-5 {
|
||
margin-bottom: 5px;
|
||
}
|
||
.mb-10 {
|
||
margin-bottom: 10px;
|
||
}
|
||
.mb-15 {
|
||
margin-bottom: 15px;
|
||
}
|
||
.mb-20 {
|
||
margin-bottom: 20px;
|
||
}
|
||
.mb-25 {
|
||
margin-bottom: 25px;
|
||
}
|
||
.mb-30 {
|
||
margin-bottom: 30px;
|
||
}
|
||
.ml-5 {
|
||
margin-left: 5px;
|
||
}
|
||
.ml-10 {
|
||
margin-left: 10px;
|
||
}
|
||
.ml-15 {
|
||
margin-left: 15px;
|
||
}
|
||
.ml-20 {
|
||
margin-left: 20px;
|
||
}
|
||
.ml-25 {
|
||
margin-left: 25px;
|
||
}
|
||
.ml-30 {
|
||
margin-left: 30px;
|
||
}
|
||
/**
|
||
* 定义无(内)边距
|
||
* @remark 无
|
||
*/
|
||
.nopt {
|
||
padding-top: initial;
|
||
}
|
||
.nopr {
|
||
padding-right: initial;
|
||
}
|
||
.nopb {
|
||
padding-bottom: initial;
|
||
}
|
||
.nopl {
|
||
padding-left: initial;
|
||
}
|
||
/**
|
||
* 定义(内)边距
|
||
* @remark 无
|
||
*/
|
||
.p-5 {
|
||
padding: 5px;
|
||
}
|
||
.p-10 {
|
||
padding: 10px;
|
||
}
|
||
.p-15 {
|
||
padding: 15px;
|
||
}
|
||
.p-20 {
|
||
padding: 20px;
|
||
}
|
||
.p-25 {
|
||
padding: 25px;
|
||
}
|
||
.p-30 {
|
||
padding: 30px;
|
||
}
|
||
.pt-5 {
|
||
padding-top: 5px;
|
||
}
|
||
.pt-10 {
|
||
padding-top: 10px;
|
||
}
|
||
.pt-15 {
|
||
padding-top: 15px;
|
||
}
|
||
.pt-20 {
|
||
padding-top: 20px;
|
||
}
|
||
.pt-25 {
|
||
padding-top: 25px;
|
||
}
|
||
.pt-30 {
|
||
padding-top: 30px;
|
||
}
|
||
.pr-5 {
|
||
padding-right: 5px;
|
||
}
|
||
.pr-10 {
|
||
padding-right: 10px;
|
||
}
|
||
.pr-15 {
|
||
padding-right: 15px;
|
||
}
|
||
.pr-20 {
|
||
padding-right: 20px;
|
||
}
|
||
.pr-25 {
|
||
padding-right: 25px;
|
||
}
|
||
.pr-30 {
|
||
padding-right: 30px;
|
||
}
|
||
.pb-5 {
|
||
padding-bottom: 5px;
|
||
}
|
||
.pb-10 {
|
||
padding-bottom: 10px;
|
||
}
|
||
.pb-15 {
|
||
padding-bottom: 15px;
|
||
}
|
||
.pb-20 {
|
||
padding-bottom: 20px;
|
||
}
|
||
.pb-25 {
|
||
padding-bottom: 25px;
|
||
}
|
||
.pb-30 {
|
||
padding-bottom: 30px;
|
||
}
|
||
.pl-5 {
|
||
padding-left: 5px;
|
||
}
|
||
.pl-10 {
|
||
padding-left: 10px;
|
||
}
|
||
.pl-15 {
|
||
padding-left: 15px;
|
||
}
|
||
.pl-20 {
|
||
padding-left: 20px;
|
||
}
|
||
.pl-25 {
|
||
padding-left: 25px;
|
||
}
|
||
.pl-30 {
|
||
padding-left: 30px;
|
||
}
|
||
/**
|
||
*
|
||
* header.less
|
||
*
|
||
* 头部
|
||
*
|
||
* version 1.0.0.0(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author pye-mail@163.com
|
||
*
|
||
* create log 2015年6月12日11:06:05
|
||
*
|
||
* last update 无
|
||
*
|
||
* remark
|
||
*
|
||
*/
|
||
header,
|
||
.header {
|
||
width: 100%;
|
||
height: 5rem;
|
||
background-color: #fff;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
z-index: 500;
|
||
*zoom: 1;
|
||
}
|
||
header:before,
|
||
.header:before,
|
||
header:after,
|
||
.header:after {
|
||
content: "";
|
||
display: block;
|
||
}
|
||
header:after,
|
||
.header:after {
|
||
clear: both;
|
||
font-size: 0;
|
||
height: 0;
|
||
line-height: 0;
|
||
visibility: hidden;
|
||
}
|
||
header .header-left,
|
||
.header .header-left {
|
||
width: 10rem;
|
||
height: 100%;
|
||
float: left;
|
||
position: absolute;
|
||
}
|
||
header .header-left .logo,
|
||
.header .header-left .logo {
|
||
margin-top: 0.7rem;
|
||
margin-left: 0.7rem;
|
||
display: block;
|
||
}
|
||
header .header-left .logo img,
|
||
.header .header-left .logo img {
|
||
width: 100%;
|
||
}
|
||
header .header-right,
|
||
.header .header-right {
|
||
margin-left: 11.5rem;
|
||
margin-right: 1rem;
|
||
}
|
||
header .header-right .search-box,
|
||
.header .header-right .search-box {
|
||
height: 3rem;
|
||
margin-top: 1rem;
|
||
background-color: #fff;
|
||
position: relative;
|
||
overflow: hidden;
|
||
-webkit-border-radius: 3px;
|
||
-moz-border-radius: 3px;
|
||
border-radius: 3px;
|
||
}
|
||
header .header-right .search-box .ui-icon-search,
|
||
.header .header-right .search-box .ui-icon-search {
|
||
width: 1.5rem;
|
||
height: 1.5rem;
|
||
display: block;
|
||
position: absolute;
|
||
top: 50%;
|
||
margin-top: -0.75rem;
|
||
left: 1rem;
|
||
}
|
||
header .header-right .search-box .box-wrap,
|
||
.header .header-right .search-box .box-wrap {
|
||
margin-left: 3rem;
|
||
height: 100%;
|
||
}
|
||
header .header-right .search-box .box-wrap .ui-input-search,
|
||
.header .header-right .search-box .box-wrap .ui-input-search {
|
||
border: none;
|
||
width: 100%;
|
||
height: 100%;
|
||
line-height: 3rem;
|
||
background-color: #fff;
|
||
padding: 0;
|
||
border:1px solid #ededed;
|
||
|
||
}
|
||
/**
|
||
*
|
||
* header.less
|
||
*
|
||
* 头部
|
||
*
|
||
* version 1.0.0.0(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author pye-mail@163.com
|
||
*
|
||
* create log 2015年6月12日11:06:05
|
||
*
|
||
* last update 无
|
||
*
|
||
* remark
|
||
*
|
||
*/
|
||
.banner {
|
||
width: 100%;
|
||
}
|
||
.ui-slider {
|
||
overflow: hidden;
|
||
position: relative;
|
||
height: 22rem;
|
||
}
|
||
.ui-slider .ui-slider-cont {
|
||
overflow: hidden;
|
||
margin: 0;
|
||
padding: 0;
|
||
*zoom: 1;
|
||
}
|
||
.ui-slider .ui-slider-cont:before,
|
||
.ui-slider .ui-slider-cont:after {
|
||
content: "";
|
||
display: block;
|
||
}
|
||
.ui-slider .ui-slider-cont:after {
|
||
clear: both;
|
||
font-size: 0;
|
||
height: 0;
|
||
line-height: 0;
|
||
visibility: hidden;
|
||
}
|
||
.ui-slider .ui-slider-cont .ui-slider-repeater {
|
||
width: 100%;
|
||
height: auto;
|
||
-webkit-transition: all 0.2s ease 0s;
|
||
-moz-transition: all 0.2s ease 0s;
|
||
-o-transition: all 0.2s ease 0s;
|
||
transition: all 0.2s ease 0s;
|
||
}
|
||
.ui-slider .ui-slider-cont .ui-slider-repeater a {
|
||
height: 100%;
|
||
display: block;
|
||
}
|
||
.ui-slider .ui-slider-cont .ui-slider-repeater .ui-slider-item {
|
||
margin: 0;
|
||
width: 100%;
|
||
height: auto;
|
||
}
|
||
.ui-slider .ui-slider-cont .ui-slider-repeater .ui-slider-item img {
|
||
width: 100%;
|
||
height: 22rem;
|
||
}
|
||
.ui-slider .ui-slider-indicators {
|
||
width: 140px;
|
||
height: 30px;
|
||
line-height: 30px;
|
||
position: absolute;
|
||
bottom: 0px;
|
||
left: 50%;
|
||
margin-left: -75px;
|
||
}
|
||
.ui-slider .ui-slider-indicators .ui-slider-indicator {
|
||
width: 10px;
|
||
height: 10px;
|
||
margin: 5px;
|
||
background: #bcbdbd;
|
||
float: left;
|
||
font-size: 0px;
|
||
-webkit-border-radius: 8px;
|
||
-moz-border-radius: 8px;
|
||
border-radius: 8px;
|
||
}
|
||
.ui-slider .ui-slider-indicators .ui-slider-indicator.active {
|
||
background: #e60012;
|
||
}
|
||
.ui-slider.ui-slider-productdetail {
|
||
height: 360px;
|
||
}
|
||
/**
|
||
*
|
||
* nav.less
|
||
*
|
||
* 导航
|
||
*
|
||
* version 1.0.0.0(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author pye-mail@163.com
|
||
*
|
||
* create log 2015年6月12日10:21:19
|
||
*
|
||
* last update 无
|
||
*
|
||
* remark
|
||
*
|
||
*/
|
||
nav,
|
||
.nav {
|
||
width: 100%;
|
||
height: auto;
|
||
background-color: #fff;
|
||
*zoom: 1;
|
||
}
|
||
nav:before,
|
||
.nav:before,
|
||
nav:after,
|
||
.nav:after {
|
||
content: "";
|
||
display: block;
|
||
}
|
||
nav:after,
|
||
.nav:after {
|
||
clear: both;
|
||
font-size: 0;
|
||
height: 0;
|
||
line-height: 0;
|
||
visibility: hidden;
|
||
}
|
||
nav .nav-item,
|
||
.nav .nav-item {
|
||
width: 25%;
|
||
height: 8rem;
|
||
float: left;
|
||
text-align: center;
|
||
color: #666666;
|
||
font-size: 1.3rem;
|
||
}
|
||
nav .nav-item a,
|
||
.nav .nav-item a {
|
||
color: #666666;
|
||
margin-top: 0.5rem;
|
||
display: inline-block;
|
||
padding: 0 0.5rem;
|
||
position: relative;
|
||
}
|
||
nav .nav-item .icon,
|
||
.nav .nav-item .icon {
|
||
display: block;
|
||
width: 5rem;
|
||
height: 5rem;
|
||
position: relative;
|
||
left: 50%;
|
||
margin-left: -2.5rem;
|
||
}
|
||
|
||
nav .nav-item span,
|
||
.nav .nav-item span {
|
||
margin-top: .2rem;
|
||
display: block;
|
||
height: 2rem;
|
||
overflow: hidden;
|
||
}
|
||
/**
|
||
*
|
||
* icon.less
|
||
*
|
||
* 图标
|
||
*
|
||
* version 1.0.0.0(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author pye-mail@163.com
|
||
*
|
||
* create log 2015年6月12日15:45:04
|
||
*
|
||
* last update 无
|
||
*
|
||
* remark
|
||
*
|
||
*/
|
||
.icon {
|
||
background: url('/images/s-master2.0.png') no-repeat;
|
||
|
||
display: block;
|
||
background-size: 160px 160px;
|
||
}
|
||
.icon.icon-type {
|
||
background-position: 4px -50px;
|
||
}
|
||
.icon.icon-order {
|
||
background-position: -52px -50px;
|
||
}
|
||
.icon.icon-shopcart {
|
||
background-position: 4px -107px;
|
||
}
|
||
.icon.icon-download {
|
||
background-position: -52px -107px;
|
||
}
|
||
.ui-icon {
|
||
background: url('/images/ui-icon2.0.png') no-repeat;
|
||
_background: url('/images/ui-icon2.0.gif') no-repeat;
|
||
width: 20px;
|
||
height: 20px;
|
||
display: block;
|
||
background-size: 160px 160px;
|
||
}
|
||
.ui-icon.ui-icon-search {
|
||
background-position: 2px 3px;
|
||
}
|
||
.ui-icon-home {
|
||
background-position: 8px -24px;
|
||
}
|
||
.ui-icon-type {
|
||
background-position: 9px -59px;
|
||
}
|
||
.ui-icon-shopcart {
|
||
background-position: 6px -93px;
|
||
}
|
||
.ui-icon-my {
|
||
background-position: 10px -128px;
|
||
}
|
||
.ui-icon-team {
|
||
height: 75px;
|
||
width: 75px;
|
||
background-position: -78px -78px;
|
||
}
|
||
footer .ui-repeater-item.active .ui-icon-home,
|
||
.footer .ui-repeater-item.active .ui-icon-home {
|
||
background-position: -32px -24px;
|
||
}
|
||
footer .ui-repeater-item.active .ui-icon-type,
|
||
.footer .ui-repeater-item.active .ui-icon-type {
|
||
background-position: -33px -59px;
|
||
}
|
||
footer .ui-repeater-item.active .ui-icon-shopcart,
|
||
.footer .ui-repeater-item.active .ui-icon-shopcart {
|
||
background-position: -35px -93px;
|
||
}
|
||
footer .ui-repeater-item.active .ui-icon-my,
|
||
.footer .ui-repeater-item.active .ui-icon-my {
|
||
background-position: -34px -128px;
|
||
}
|
||
footer .ui-repeater-item.active .ui-icon-team,
|
||
.footer .ui-repeater-item.active .ui-icon-team {
|
||
background-position: -78px 0px;
|
||
}
|
||
/**
|
||
*
|
||
* product.less
|
||
*
|
||
* 产品
|
||
*
|
||
* version 1.0.0.0(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author hemei
|
||
*
|
||
* create log 2015年6月12日09:42:10
|
||
*
|
||
* last update 无
|
||
*
|
||
*
|
||
*/
|
||
.product {
|
||
margin: 5px 5px 0 5px;
|
||
}
|
||
.product .product-cont {
|
||
width: 100%;
|
||
height: auto;
|
||
*zoom: 1;
|
||
}
|
||
.product .product-cont:before,
|
||
.product .product-cont:after {
|
||
content: "";
|
||
display: block;
|
||
}
|
||
.product .product-cont:after {
|
||
clear: both;
|
||
font-size: 0;
|
||
height: 0;
|
||
line-height: 0;
|
||
visibility: hidden;
|
||
}
|
||
.product .product-cont .product-item {
|
||
float: left;
|
||
width: 50%;
|
||
height: auto;
|
||
}
|
||
.product .product-cont .product-item a {
|
||
display: block;
|
||
margin: 5px;
|
||
padding: 5px;
|
||
background-color: #fff;
|
||
}
|
||
.product .product-cont .product-item h3
|
||
{
|
||
margin: 5px;
|
||
padding: 0px;
|
||
background-color: #c3d600;
|
||
height:35px;
|
||
line-height:35px;
|
||
}
|
||
.product .product-cont .product-item h3 a {
|
||
display: block;
|
||
margin:0;
|
||
padding:0;
|
||
padding:0 5px;
|
||
height:35px;
|
||
line-height:35px;
|
||
background-color: #c3d600;
|
||
color:#fff;
|
||
font-size:14px;
|
||
|
||
}
|
||
.product .product-cont .product-item h3 a.zjbb
|
||
{
|
||
float:left;
|
||
width:70px;
|
||
}
|
||
.product .product-cont .product-item h3 a.more
|
||
{
|
||
float:right;
|
||
width:70px;
|
||
background-color: #f08200;
|
||
text-align:center;
|
||
}
|
||
.product .product-cont .product-item a img {
|
||
width: 100%;
|
||
}
|
||
.product .product-cont .product-item a .product-name {
|
||
font-size: 1.4rem;
|
||
line-height: 2.4rem;
|
||
height: 2.4rem;
|
||
-webkit-text-overflow: ellipsis;
|
||
-khtml-text-overflow: ellipsis;
|
||
-icab-text-overflow: ellipsis;
|
||
-moz-text-overflow: ellipsis;
|
||
-o-text-overflow: ellipsis;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
}
|
||
.product .product-cont .product-item a .product-info {
|
||
color: #b6b6b6;
|
||
font-size: 1.1rem;
|
||
line-height: 2rem;
|
||
height: 2rem;
|
||
-webkit-text-overflow: ellipsis;
|
||
-khtml-text-overflow: ellipsis;
|
||
-icab-text-overflow: ellipsis;
|
||
-moz-text-overflow: ellipsis;
|
||
-o-text-overflow: ellipsis;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
}
|
||
.product .product-cont .product-item a .product-price {
|
||
color: #df1717;
|
||
font-size: 1.2rem;
|
||
clear: both;
|
||
font-family:Arial;
|
||
}
|
||
.product .product-cont .product-item a .product-price span {
|
||
float: right;
|
||
color: #999999;
|
||
font-size: 1.1rem;
|
||
font-family:Arial;
|
||
}
|
||
/**更多**/
|
||
.more {
|
||
margin: 0 10px;
|
||
}
|
||
.more .product-more-hd {
|
||
text-align: center;
|
||
background-color: #eee;
|
||
color: #999999;
|
||
overflow: hidden;
|
||
height: 3.5rem;
|
||
position: relative;
|
||
}
|
||
.more .product-more-hd .more-line {
|
||
border-bottom: 1px solid #ccc;
|
||
width: 60%;
|
||
margin: 2rem auto;
|
||
}
|
||
.more .product-more-hd .more-txt {
|
||
width: 6rem;
|
||
height: 2.4rem;
|
||
line-height: 2.4rem;
|
||
background-color: #eee;
|
||
z-index: 100;
|
||
position: absolute;
|
||
top: 1rem;
|
||
left: 50%;
|
||
margin-left: -3rem;
|
||
}
|
||
/**
|
||
*
|
||
* product.less
|
||
*
|
||
* 分类
|
||
*
|
||
* version 1.0.0.0(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author hemei
|
||
*
|
||
* create log 2015年6月12日13:47:35
|
||
*
|
||
* last update 无
|
||
*
|
||
*
|
||
*/
|
||
.classify {
|
||
margin: 0 10px;
|
||
background-color: #fff;
|
||
}
|
||
.classify .classify-cont {
|
||
width: 100%;
|
||
height: auto;
|
||
*zoom: 1;
|
||
}
|
||
.classify .classify-cont:before,
|
||
.classify .classify-cont:after {
|
||
content: "";
|
||
display: block;
|
||
}
|
||
.classify .classify-cont:after {
|
||
clear: both;
|
||
font-size: 0;
|
||
height: 0;
|
||
line-height: 0;
|
||
visibility: hidden;
|
||
}
|
||
.classify .classify-cont .classify-item {
|
||
float: left;
|
||
width: 33.33%;
|
||
height: auto;
|
||
margin: 3% auto;
|
||
}
|
||
.classify .classify-cont .classify-item a {
|
||
display: block;
|
||
text-align: center;
|
||
width: 100%;
|
||
}
|
||
.classify .classify-cont .classify-item a img {
|
||
width: 82%;
|
||
border-radius: 50%;
|
||
display: block;
|
||
margin-left: 9%;
|
||
}
|
||
.classify .classify-cont .classify-item a .classify-name {
|
||
font-size: 1.4rem;
|
||
}
|
||
.classify .classify-cont .classify-item a span {
|
||
display: block;
|
||
margin-top: 10px;
|
||
}
|
||
/**
|
||
*
|
||
* tab.less
|
||
*
|
||
* 选项卡
|
||
*
|
||
* version 1.0.0.0(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author pye-mail@163.com
|
||
*
|
||
* create log 2015年6月23日16:15:53
|
||
*
|
||
* last update 无
|
||
*
|
||
* remark
|
||
*
|
||
*/
|
||
.ui-tab {
|
||
height: auto;
|
||
margin-left: -1px;
|
||
*zoom: 1;
|
||
}
|
||
.ui-tab:before,
|
||
.ui-tab:after {
|
||
content: "";
|
||
display: block;
|
||
}
|
||
.ui-tab:after {
|
||
clear: both;
|
||
font-size: 0;
|
||
height: 0;
|
||
line-height: 0;
|
||
visibility: hidden;
|
||
}
|
||
.ui-tab .ui-tab-item {
|
||
width: 25%;
|
||
height: 43px;
|
||
float: left;
|
||
background-color: #f7f7f7;
|
||
border-bottom: 1px solid #c7c7c7;
|
||
}
|
||
.ui-tab .ui-tab-item a {
|
||
display: block;
|
||
width: 100%;
|
||
height: 100%;
|
||
float: left;
|
||
}
|
||
.ui-tab .ui-tab-item a span {
|
||
display: block;
|
||
border-left: 1px solid #c7c7c7;
|
||
height: 33px;
|
||
line-height: 33px;
|
||
margin-top: .5rem;
|
||
text-align: center;
|
||
font-size: 1.6rem;
|
||
color: #717171;
|
||
-webkit-text-overflow: ellipsis;
|
||
-khtml-text-overflow: ellipsis;
|
||
-icab-text-overflow: ellipsis;
|
||
-moz-text-overflow: ellipsis;
|
||
-o-text-overflow: ellipsis;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
}
|
||
.ui-tab .ui-tab-item .active {
|
||
background-color: #fff;
|
||
}
|
||
.ui-tab .ui-tab-item .active span {
|
||
color: #e34c4b;
|
||
}
|
||
/**
|
||
*
|
||
* product.less
|
||
*
|
||
* 产品
|
||
*
|
||
* version 1.0.0.0(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author zhouxs
|
||
*
|
||
* create log 2015年6月23日14:47:19
|
||
*
|
||
*
|
||
*/
|
||
.productlist {
|
||
width: 100%;
|
||
height: auto;
|
||
background-color: #fff;
|
||
}
|
||
.productlist .ui-repeater {
|
||
float: none;
|
||
/*padding: 10px 15px;*/
|
||
}
|
||
.productlist .ui-repeater .ui-repeater-item {
|
||
float: none;
|
||
height: 100px;
|
||
border-bottom: 1px solid #ccc;
|
||
position: relative;
|
||
}
|
||
.productlist .ui-repeater .ui-repeater-item .product-thumb {
|
||
width: 80px;
|
||
height: 80px;
|
||
position: absolute;
|
||
top: 10px;
|
||
left: 15px;
|
||
margin-bottom: 10px;
|
||
}
|
||
.productlist .ui-repeater .ui-repeater-item .product-thumb img {
|
||
width: 80px;
|
||
height: 80px;
|
||
}
|
||
.productlist .ui-repeater .ui-repeater-item .product-cont {
|
||
margin-left: 110px;
|
||
margin-right: 80px;
|
||
line-height: 16px;
|
||
font-size: 11px;
|
||
color: #999;
|
||
position: relative;
|
||
top: 10px;
|
||
margin-bottom: 10px;
|
||
}
|
||
.productlist .ui-repeater .ui-repeater-item .product-cont .cont-txt-title {
|
||
color: #666;
|
||
max-height: 32px;
|
||
display: block;
|
||
position: relative;
|
||
display: -webkit-box;
|
||
-moz-box-orient: vertical;
|
||
-webkit-box-orient: vertical;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
-webkit-line-clamp: 2;
|
||
word-break: break-all;
|
||
font-size: 14px;
|
||
}
|
||
.productlist .ui-repeater .ui-repeater-item .product-cont .cont-txt-subtitle {
|
||
color: #666;
|
||
}
|
||
.productlist .ui-repeater .ui-repeater-item .product-cont .word-breaks {
|
||
max-height: 32px;
|
||
display: block;
|
||
position: relative;
|
||
display: -webkit-box;
|
||
-moz-box-orient: vertical;
|
||
-webkit-box-orient: vertical;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
-webkit-line-clamp: 2;
|
||
word-break: break-all;
|
||
}
|
||
.productlist .ui-repeater .ui-repeater-item .item-cont-btn {
|
||
width: 60px;
|
||
height: 20px;
|
||
text-align: center;
|
||
line-height: 20px;
|
||
border: 1px solid #ddd;
|
||
border-radius: 5px;
|
||
background-color: #fff;
|
||
color: #999;
|
||
position: absolute;
|
||
top: 35px;
|
||
right: 15px;
|
||
margin-bottom: 10px;
|
||
}
|
||
/**
|
||
*
|
||
* productshow.less
|
||
*
|
||
* 主页商品展示
|
||
*
|
||
* version 1.0.0.0(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author pye-mail@163.com
|
||
*
|
||
* create log 2015年6月12日10:00:51
|
||
*
|
||
* last update 无
|
||
*
|
||
*
|
||
*
|
||
*/
|
||
.product-hd {
|
||
margin: 0px 10px;
|
||
height: 4rem;
|
||
line-height: 4rem;
|
||
background: #fff;
|
||
border-bottom: 1px solid #eee;
|
||
}
|
||
.product-hd .product-hd-txt {
|
||
height: 4rem;
|
||
font-size: 1.6rem;
|
||
padding-left: 10px;
|
||
color: #333;
|
||
}
|
||
.product-hd .product-hd-more {
|
||
float: right;
|
||
/*margin-right: 1rem;*/
|
||
}
|
||
.product-hd .product-hd-more a {
|
||
display: block;
|
||
padding: 0px 8px;
|
||
color: #999;
|
||
}
|
||
.floor-product-item {
|
||
|
||
float:left;
|
||
margin: 0;
|
||
overflow: hidden;
|
||
}
|
||
.floor-product-item h3{
|
||
background-color:#FF0000;
|
||
color:#fff;
|
||
padding:.3em 1em;
|
||
}
|
||
.floor-product-item .product-hd {
|
||
width: 100%;
|
||
margin: 0px;
|
||
border-bottom: none;
|
||
}
|
||
.floor-product-item .product-item-cont {
|
||
|
||
width: 100%;
|
||
height: auto;
|
||
*zoom: 1;
|
||
text-align: center;
|
||
border-top: 1px solid #eee;
|
||
border-left: 1px solid #eee;
|
||
background: #fff;
|
||
}
|
||
|
||
.floor-product-item .product-item-cont:before,
|
||
.floor-product-item .product-item-cont:after {
|
||
content: "";
|
||
display: block;
|
||
}
|
||
.floor-product-item .product-item-cont:after {
|
||
clear: both;
|
||
font-size: 0;
|
||
height: 0;
|
||
line-height: 0;
|
||
visibility: hidden;
|
||
|
||
}
|
||
.floor-product-item .product-item-cont .product-item1-img {
|
||
width: 50%;
|
||
/*height: 100%;*/
|
||
display: block;
|
||
margin-left: -1px;
|
||
float: left;
|
||
}
|
||
.floor-product-item .product-item-cont .product-item1-img img {
|
||
width: 100%;
|
||
display: block;
|
||
/*height: 100%;*/
|
||
}
|
||
.floor-product-item .product-item-cont .product-item2-img {
|
||
width: 50%;
|
||
/*height: 100%;*/
|
||
margin-left: -1px;
|
||
display: block;
|
||
float: left;
|
||
}
|
||
.floor-product-item .product-item-cont .product-item2-img img {
|
||
width: 100%;
|
||
display: block;
|
||
/*height: 100%;*/
|
||
}
|
||
.floor-product-item .product-item-cont .product-item2-cont {
|
||
width: 50%;
|
||
float: left;
|
||
box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;
|
||
}
|
||
.floor-product-item .product-item-cont .product-item2-cont .product-cont {
|
||
width: 50%;
|
||
box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;
|
||
}
|
||
.floor-product-item .product-item-cont .product-cont {
|
||
float: left;
|
||
margin-right:-1px;
|
||
width: 50%;
|
||
border-bottom: 1px solid #eee;
|
||
border-right: 1px solid #eee;
|
||
display: block;
|
||
overflow:hidden;
|
||
box-sizing:border-box;
|
||
-moz-box-sizing:border-box;
|
||
-webkit-box-sizing:border-box;
|
||
}
|
||
|
||
.floor-product-item .product-item-cont .product-cont span {
|
||
/*width: 100%;*/
|
||
height: 1.5em;
|
||
line-height: 1.5em;
|
||
margin-left: .5em;
|
||
/*float: left;*/
|
||
display: block;
|
||
font-size: 0.85em;
|
||
}
|
||
.floor-product-item .product-item-cont .product-cont .txt {
|
||
color: #000000;
|
||
margin-top: .4em;
|
||
text-overflow:ellipsis;white-space:nowrap;
|
||
overflow: hidden;
|
||
}
|
||
.floor-product-item .product-item-cont .product-cont .rmb {
|
||
|
||
color: #df1717;
|
||
}
|
||
.floor-product-item .product-item-cont .product-cont .rmb del{
|
||
color: #9f9f9f;
|
||
}
|
||
.floor-product-item .product-item-cont .product-cont a {
|
||
display: block;
|
||
float: right;
|
||
}
|
||
.floor-product-item .product-item-cont .product-cont img {
|
||
|
||
width: 90%; margin-top:0.8em;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
|
||
}
|
||
.floor-product-item .product-item-cont > .product-cont:first-child {
|
||
border-left: none;
|
||
}
|
||
.floor-product-taocan{
|
||
float:left;
|
||
width:100%;
|
||
height:100%;
|
||
padding:0;
|
||
border: 1px solid #DFDFDF;
|
||
box-sizing:border-box;
|
||
-moz-box-sizing:border-box;
|
||
-webkit-box-sizing:border-box;
|
||
}
|
||
.floor-product-taocan h3{
|
||
float:left;
|
||
width:100%;
|
||
padding:0.5em 1em;
|
||
background-color:#810d5f;
|
||
color: #fff;
|
||
box-sizing:border-box;
|
||
-moz-box-sizing:border-box;
|
||
-webkit-box-sizing:border-box;
|
||
}
|
||
.floor-product-taocan-box{
|
||
float:left;
|
||
background-color:#fff;
|
||
width:100%;
|
||
|
||
}
|
||
.floor-product-taocan-item{
|
||
float:left;
|
||
width:50%;
|
||
height:32em;
|
||
text-align:center;
|
||
border: 1px solid #d9b4ce;
|
||
overflow:hidden;
|
||
box-sizing:border-box;
|
||
-moz-box-sizing:border-box;
|
||
-webkit-box-sizing:border-box;
|
||
}
|
||
.floor-product-taocan-item span{
|
||
float:left;
|
||
display: block;
|
||
width:100%;
|
||
padding:0.2em 1em;
|
||
box-sizing:border-box;
|
||
-moz-box-sizing:border-box;
|
||
-webkit-box-sizing:border-box;
|
||
|
||
text-align: left;
|
||
font-style:normal;
|
||
font-family:"Arial"
|
||
}
|
||
.floor-product-taocan-item span.txt{
|
||
background-color:#f1e7ee;
|
||
color: #000
|
||
}
|
||
|
||
.floor-product-taocan-item span span{
|
||
width:auto;
|
||
color:red;
|
||
}
|
||
|
||
.floor-product h3 span{ float:right;}
|
||
.product-flashsale {
|
||
background-color: #fee8dd;
|
||
*zoom: 1;
|
||
}
|
||
.product-flashsale:before,
|
||
.product-flashsale:after {
|
||
content: "";
|
||
display: block;
|
||
}
|
||
.product-flashsale:after {
|
||
clear: both;
|
||
font-size: 0;
|
||
height: 0;
|
||
line-height: 0;
|
||
visibility: hidden;
|
||
}
|
||
.product-flashsale .product-hd-flashsale {
|
||
width: 100%;
|
||
height: auto;
|
||
max-height: 90px;
|
||
text-align: center;
|
||
}
|
||
.product-flashsale .product-hd-flashsale .flashsale-hd-bg {
|
||
width: 175px;
|
||
margin: 0 auto;
|
||
display: block;
|
||
}
|
||
.product-flashsale .product-hd-flashsale .timer {
|
||
width: 100%;
|
||
height: 30px;
|
||
line-height: 30px;
|
||
position: relative;
|
||
color: #ff611a;
|
||
font-size: 1.2rem;
|
||
font-family: 宋体;
|
||
white-space: nowrap;
|
||
}
|
||
.product-flashsale .product-hd-flashsale .timer .timer-span {
|
||
width: 18px;
|
||
height: 18px;
|
||
border: 1px solid #ff611a;
|
||
border-radius: 2px;
|
||
background-color: #fff;
|
||
/*position: absolute;*/
|
||
line-height: 18px;
|
||
/*margin-top: -4px;
|
||
margin-left:-31px;*/
|
||
text-align: center;
|
||
display: inline-block;
|
||
}
|
||
.product-flashsale .product-hd-flashsale .timer .timer-unit {
|
||
margin-left: 2px;
|
||
font-weight: 600;
|
||
}
|
||
.product-flashsale .ui-repeater {
|
||
display: inline;
|
||
padding: 14px 0px;
|
||
line-height: 1.8rem;
|
||
width: 100%;
|
||
*zoom: 1;
|
||
clear: both;
|
||
display: block;
|
||
/*font-size: 0;height: 0;line-height: 0;visibility: hidden;*/
|
||
}
|
||
.product-flashsale .ui-repeater .ui-repeater-item {
|
||
width: 33.3%;
|
||
height: auto;
|
||
background-color: #fee8dd;
|
||
font-family: 黑体;
|
||
text-align: center;
|
||
}
|
||
.product-flashsale .ui-repeater .ui-repeater-item .flashsale-photo img {
|
||
width: 100%;
|
||
}
|
||
.product-flashsale .ui-repeater .ui-repeater-item .flashsale-name {
|
||
font-size: 1.4rem;
|
||
color: #666;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
}
|
||
.product-flashsale .ui-repeater .ui-repeater-item .flashsale-subname {
|
||
font-size: 1rem;
|
||
color: #999;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
}
|
||
.product-flashsale .ui-repeater .ui-repeater-item .flashsale-price {
|
||
margin: 0 6px;
|
||
height: 24px;
|
||
line-height: 24px;
|
||
border-radius: 24px;
|
||
font-size: 1.6rem;
|
||
color: #fff;
|
||
background-color: #ff611a;
|
||
}
|
||
.product-flashsale .ui-repeater .ui-repeater-item a {
|
||
display: block;
|
||
padding: 4px 4px 6px 4px;
|
||
margin: 0px 3px;
|
||
background-color: #fff;
|
||
}
|
||
.product-flashsale .ui-repeater :last-child {
|
||
margin-right: 0px;
|
||
}
|
||
/**
|
||
*
|
||
* footer.less
|
||
*
|
||
* 底部
|
||
*
|
||
* version 1.0.0.0(主版本号.子版本号.编译版本号.修正版本号)
|
||
*
|
||
* @author pye-mail@163.com
|
||
*
|
||
* create log 2015年6月16日16:02:19
|
||
*
|
||
* last update 无
|
||
*
|
||
* remark
|
||
*
|
||
*/
|
||
/**
|
||
* 数据列表
|
||
* @remark 无
|
||
*/
|
||
.ui-repeater {
|
||
float: left;
|
||
}
|
||
.ui-repeater .ui-repeater-item {
|
||
float: left;
|
||
margin: 0px;
|
||
padding: 0px;
|
||
}
|
||
footer,
|
||
.footer {
|
||
position: fixed;
|
||
left: 0px;
|
||
bottom: -2px;
|
||
width: 100%;
|
||
background: #333;
|
||
border-top: 1px solid #333;
|
||
z-index: 900;
|
||
height: 5rem;
|
||
font-family: '黑体';
|
||
}
|
||
footer .ui-repeater,
|
||
.footer .ui-repeater {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
footer .ui-repeater .ui-repeater-item,
|
||
.footer .ui-repeater .ui-repeater-item {
|
||
width: 20%;
|
||
height: 100%;
|
||
text-align: center;
|
||
}
|
||
footer .ui-repeater .ui-repeater-item a,
|
||
.footer .ui-repeater .ui-repeater-item a {
|
||
display: block;
|
||
width: 100%;
|
||
height: 100%;
|
||
position: relative;
|
||
}
|
||
footer .ui-repeater .ui-repeater-item a .ui-icon,
|
||
.footer .ui-repeater .ui-repeater-item a .ui-icon {
|
||
position: absolute;
|
||
top: 5px;
|
||
left: 50%;
|
||
margin-left: -19px;
|
||
width: 36px;
|
||
height: 30px;
|
||
}
|
||
footer .ui-repeater .ui-repeater-item a span,
|
||
.footer .ui-repeater .ui-repeater-item a span {
|
||
font-size: 0.8rem;
|
||
color: #999;
|
||
margin-top: 30px;
|
||
float: left;
|
||
width: 100%;
|
||
position: relative;
|
||
z-index: 10;
|
||
}
|
||
footer .ui-repeater .team-enter,
|
||
.footer .ui-repeater .team-enter {
|
||
position: relative;
|
||
}
|
||
footer .ui-repeater .team-enter a,
|
||
.footer .ui-repeater .team-enter a {
|
||
position: absolute;
|
||
top: -20px;
|
||
height: 75px;
|
||
}
|
||
footer .ui-repeater .team-enter a .ui-icon-team,
|
||
.footer .ui-repeater .team-enter a .ui-icon-team {
|
||
margin-left: -38px;
|
||
height: 75px;
|
||
width: 75px;
|
||
}
|
||
footer .ui-repeater .team-enter a span,
|
||
.footer .ui-repeater .team-enter a span {
|
||
margin-top: 55px;
|
||
color: #333333;
|
||
}
|
||
footer .ui-repeater .ui-repeater-item.active span,
|
||
.footer .ui-repeater .ui-repeater-item.active span {
|
||
color: #de1717;
|
||
}
|
||
footer .ui-repeater .team-enter.active span,
|
||
.footer .ui-repeater .team-enter.active span {
|
||
color: #efefef;
|
||
}
|
||
body {
|
||
background-color: #eeeeee;
|
||
color: #666666;
|
||
}
|
||
a {
|
||
color: #666666;
|
||
}
|
||
.wrap-main {
|
||
width: 100%;
|
||
height: auto;
|
||
*zoom: 1;
|
||
}
|
||
.wrap-main:before,
|
||
.wrap-main:after {
|
||
content: "";
|
||
display: block;
|
||
}
|
||
.wrap-main:after {
|
||
clear: both;
|
||
font-size: 0;
|
||
height: 0;
|
||
line-height: 0;
|
||
visibility: hidden;
|
||
}
|
||
.wrap-main.mt-44 {
|
||
margin-top: 44px;
|
||
}
|
||
.wrap-main.mb-50 {
|
||
margin-bottom: 5rem;
|
||
}
|
||
/**首页流量*/
|
||
.advertisement {
|
||
margin-top: 0.5rem;
|
||
margin-bottom: -0.5rem;
|
||
}
|
||
.advertisement a {
|
||
display: block;
|
||
font-size: 0px;
|
||
}
|
||
.advertisement a img {
|
||
width: 100%;
|
||
}
|
||
/**我的活动**/
|
||
.myactivity {
|
||
background-color: #fff;
|
||
}
|
||
|
||
|
||
.zjbox
|
||
{
|
||
height:30px;
|
||
}
|
||
.zjbox li
|
||
{
|
||
float:left;
|
||
margin-left:5px;
|
||
height:25px;
|
||
width:296px;
|
||
font-size:14px;
|
||
line-height:25px;
|
||
color:#000;
|
||
}
|
||
.zjbox li span
|
||
{
|
||
float:left;
|
||
display:block;
|
||
color:red;
|
||
text-align:center;
|
||
}
|
||
.zjbox li span.span1
|
||
{
|
||
width:100px;
|
||
}
|
||
.zjbox li span.span2
|
||
{
|
||
width:80px;
|
||
}
|
||
.zjbox li span.span3
|
||
{
|
||
width:100px;
|
||
} |