﻿/*
 * @Description: 样式基础配置文件 不在这个页面写样式，只写基础配置
 * @fileName: base.css
 * @Author: LiSuwan
 * @Date: 2020-01-09 11:54:14
 * @LastEditors: LiSuwan
 * @LastEditTime: 2022-07-12 14:03:38
 */

@charset "utf-8";
* {
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    /* 手机端所有标签鼠标都是手型 */
    /* 解决手机微信公众号中的网页文字无法复制到剪切板问题 start */
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    /* 解决手机微信公众号中的网页文字无法复制到剪切板问题 end */
    -webkit-tap-highlight-color: transparent;
    /*用于iOS (iPhone和iPad)。当你点击一个链接或者通过Javascript定义的可点击元素的时候，设置为半透明的灰色背景*/
    word-wrap: break-word;
}

html {
    font: normal 14px "微软雅黑", Arial;
    width: 100%;
    height: 100%;
}

body {
    padding: 0px;
    margin: 0px auto;
    color: #666;
    width: 100%;
    /*min-width: 1200px;*/
    /*width: expression((documentElement.clientWidth < 1200) ? "1200px" : "100%" );*/
    font-size: 0px;
    height: 100%;
    padding-top: constant(safe-area-inset-top);
    padding-left: constant(safe-area-inset-left);
    padding-right: constant(safe-area-inset-right);
    padding-bottom: constant(safe-area-inset-bottom);
}


/* 隐藏 input[type=number] 的上下箭头 */

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

ul,
li,
ol {
    list-style: none;
}

select,
input,
textarea {
    border-radius: 0;
    -webkit-border-radius: 0;
    color: #666;
    background: none;
    border: none;
    resize: none
}

input:focus {
    outline: none;
}

input,
button,
select,
textarea {
    outline: none;
    /* -webkit-appearance:none; */
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    /*强制去除表单自带的样式*/
    font: normal 14px "微软雅黑", Arial;
}

textarea {
    resize: none;
    /*-webkit-appearance:none;*/
    /*强制去除textarea自带的样式*/
}

article,
aside,
footer,
header,
nav,
section,
figure,
figcaption {
    display: block;
}


/*html5设置*/

figure,
figcaption {
    margin: 0px;
    padding: 0px;
}

audio,
canvas,
progress,
video {
    display: inline-block;
    vertical-align: baseline;
}

img {
    border: none;
    border: 0;
    vertical-align: middle;
}

a,
a:hover,
a:focus {
    outline: none;
    -moz-outline: none;
    text-decoration: none;
}

.clear {
    display: block;
    clear: both;
    height: 0px;
    overflow: hidden;
}


/* 设置placeholder默认文字颜色样式 start*/

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #b8b8b8;
}

input::-moz-input-placeholder,
textarea::-moz-input-placeholder {
    color: #b8b8b8;
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
    color: #b8b8b8;
}


/* 设置placeholder默认文字颜色样式 end*/

.cursor {
    cursor: pointer;
}


/* 单选框样式
     <label >
     <input type="radio" name="paixu" >
        按热门排序
    </label>
    start
*/


/* 选中前的样式 */

input[type=radio] {
    width: 16px;
    height: 16px;
    border: 1px solid #e5e5e5;
}


/* 选中后的样式(使用背景图写的，使用时换背景图即可) */

input[type=radio]:checked {
    background: url(./pcTemplate/images/radoi_checkedhiolk.png) left top no-repeat;
    background-size: 100% 100%;
    border: 1px solid transparent;
}


/* 单选框样式
     <label >
     <input type="radio" name="paixu" >
        按热门排序
    </label>
    end
*/


/* 复选框
    <label >
    <input type="checkbox" name="" >
        按热门排序
    </label>
    start
 */


/* 选前的样式 */

input[type=checkbox] {
    width: 16px;
    height: 16px;
    border: 1px solid #e5e5e5;
}


/* 选中之后的样式 */

input[type=checkbox]:checked {
    background: url(./pcTemplate/images/radoi_checkedhiolk.png) left top no-repeat;
    background-size: 100% 100%;
    border: 1px solid transparent;
}


/* 复选框
    <label >
    <input type="checkbox" name="" >
        按热门排序
    </label>
    end
 */


/* 文字一行展示，超过长度用 ... 表示： start */

.one_line {
    white-space: nowrap;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    overflow: hidden;
}


/* 文字一行展示，超过长度用 ... 表示： end */


/* 多行展示，超过长度用 ... 表示： start */

.much_line {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}


/* 多行展示，超过长度用 ... 表示： end */


/*优化input框有默认文字的样式 start*/

input {
    -webkit-text-fill-color: #333;
    -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
    background-color: transparent;
    background-image: none;
    transition: background-color 50000s ease-in-out 0s;
}


/*优化input框有默认文字的样式 end*/


/*input type=number时，去掉后面的上下按钮 start*/

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

input[type="number"] {
    -moz-appearance: textfield;
}


/*input type=number时，去掉后面的上下按钮 end*/

input {
    -webkit-text-fill-color: #333;
    -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
    background-color: transparent;
    background-image: none;
    transition: background-color 50000s ease-in-out 0s;
}


/*优化input框有默认文字的样式 end*/


/*input type=number时，去掉后面的上下按钮 start*/

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

input[type="number"] {
    -moz-appearance: textfield;
}


/*input type=number时，去掉后面的上下按钮 end*/