portal html css js resource

common.css 16KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256
  1. @charset "utf-8";
  2. /*reset*/
  3. p,dl,dt,dd,ul,ol,li,a,em,div,span,th,td{margin:0;padding:0; word-break:break-all; font-family:PingFang SC,Arial,Microsoft Yahei,WenQuanYi Micro Hei,Helvetica Neue,Hiragino Sans GB,sans-serif;}
  4. form,label,button,input,select,textarea{font-size:14px; font-family:PingFang SC,Arial,Microsoft Yahei,WenQuanYi Micro Hei,Helvetica Neue,Hiragino Sans GB,sans-serif;}
  5. h1,h2,h3,h4,h5,h6{font-size:100%;margin:0;padding:0; font-family:PingFang SC,Arial,Microsoft Yahei,WenQuanYi Micro Hei,Helvetica Neue,Hiragino Sans GB,sans-serif;}
  6. html,body{height:100%; width:100%; margin:0;padding:0;font-family:PingFang SC,Arial,Microsoft Yahei,WenQuanYi Micro Hei,Helvetica Neue,Hiragino Sans GB,sans-serif;}
  7. input{vertical-align:middle; outline:none;}
  8. img{color:transparent;font-size:0;vertical-align:middle;-ms-interpolation-mode:bicubic;border:0;padding:0; margin:0;}
  9. small{font-size:12px;}
  10. ul,ol{list-style:none;}
  11. button,input,select,textarea{font-size:100%;}
  12. table{border-collapse:collapse;border-spacing:0;}
  13. a,a:active,a:hover{outline:0;text-decoration:none;}
  14. /*reset--base///*/
  15. [class^="icon-"],
  16. [class*=" icon-"] {
  17. display: inline-block;
  18. width: 14px;
  19. height: 14px;
  20. *margin-right: .3em;
  21. line-height: 14px;
  22. vertical-align: text-top;
  23. background-image: url("../images/glyphicons-halflings.png");
  24. background-position: 14px 14px;
  25. background-repeat: no-repeat;
  26. margin-top: 1px;
  27. }
  28. /* White icons with optional class, or on hover/active states of certain elements */
  29. .icon-white,
  30. .nav-pills > .active > a > [class^="icon-"],
  31. .nav-pills > .active > a > [class*=" icon-"],
  32. .nav-list > .active > a > [class^="icon-"],
  33. .nav-list > .active > a > [class*=" icon-"],
  34. .navbar-inverse .nav > .active > a > [class^="icon-"],
  35. .navbar-inverse .nav > .active > a > [class*=" icon-"],
  36. .dropdown-menu > li > a:hover > [class^="icon-"],
  37. .dropdown-menu > li > a:hover > [class*=" icon-"],
  38. .dropdown-menu > .active > a > [class^="icon-"],
  39. .dropdown-menu > .active > a > [class*=" icon-"],
  40. .dropdown-submenu:hover > a > [class^="icon-"],
  41. .dropdown-submenu:hover > a > [class*=" icon-"] {
  42. background-image: url("../images/glyphicons-halflings-white.png");
  43. }
  44. body{height:auto;position: relative;min-height: 100%;}
  45. a{text-decoration:none;}
  46. a:focus{}
  47. a:active,a:hover{outline:0;text-decoration:none;}
  48. /*栅格化宽度类型*/
  49. .col-w-1,.col-w-2,.col-w-3,.col-w-4,.col-w-5,.col-w-6,.col-w-7,.col-w-8,.col-w-9,.col-w-10,.col-w-11,.col-w-12{float:left;}
  50. .col-w-1{width:8.333333333333332%}
  51. .col-w-2{width:16.666666666666664%}
  52. .col-w-3{width:25%}
  53. .col-w-4{width:33.33333333333333%}
  54. .col-w-5{width:41.66666666666667%}
  55. .col-w-6{width:50%}
  56. .col-w-7{width:58.333333333333336%}
  57. .col-w-8{width:66.66666666666666%}
  58. .col-w-9{width:75%}
  59. .col-w-10{width:83.33333333333334%}
  60. .col-w-11{width:91.66666666666666%}
  61. .col-w-12{width:100%}
  62. .floatL{ float:left;}
  63. .floatR{float:right;}
  64. .clearfix{ clear:both;}
  65. .clearfix:before,.clearfix:after{display:table;content:" "}
  66. .clearfix:after{clear:both}
  67. .loading{position: absolute;top:50%;left:50%;margin-left:-15px;}
  68. /*更改placeholder的颜色*/
  69. :-moz-placeholder {color: #999;}
  70. ::-moz-placeholder {color: #999;}
  71. input:-ms-input-placeholder,textarea:-ms-input-placeholder {color: #999;}
  72. input::-webkit-input-placeholder,textarea::-webkit-input-placeholder {color: #999;}
  73. /* 显示和隐藏样式 */
  74. .inline {display:inline-block;}
  75. .displayNone{display:none;}
  76. .displayBlock{display:block;}
  77. .ellipsisSty {overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
  78. .ellipsisSty-2 { display: -webkit-box;height:40px;white-space: normal !important;text-overflow: ellipsis;word-wrap: break-word; -webkit-line-clamp:2;-webkit-box-orient: vertical;overflow: hidden;}
  79. /*文字*/
  80. .h1Font{font-size:22px; line-height:36px; color:#151520;} /*标题*/
  81. .h2Font{font-size:18px; line-height:30px; color:#333; }
  82. .h3Font{font-size:16px; line-height:28px; color:#555; }
  83. .h4Font{font-size:14px; line-height:26px; color:#333;}
  84. .h5Font{font-size:14px; line-height:22px; color:#666;}
  85. .h6Font{font-size:13px;color:#888;margin-left:8px;}
  86. .fontweight{font-weight: bold;}
  87. .smalltip{font-size:13px;line-height:24px;margin:8px 0;color:#888;}/*提示性语句*/
  88. .pIndent{ padding-left: 13px;color: #888;font-size: 12px;}
  89. .thistime{position:relative;padding:0 20px; font-size: 12px; color: #ccc;}
  90. .thistime:before{content:"";display:inline-block;width:4px; height: 4px;border-radius:50%;background: #ccc;position: absolute;top:36%;left:10px;}
  91. .paddingSpace{ padding:4px 0;}
  92. .alignCenter{text-align: center;}
  93. /*圆角*/
  94. .headRadius{border-radius: 4px;}/*头像、资源圆角*/
  95. .userRadius{border-radius:50%;}
  96. .cmpRadius{border-radius: 4px;}
  97. .bgRadius{border-radius: 6px;}/*底板背景圆角*/
  98. /*倒三角*/
  99. .to-bottom {display: inline-block;overflow: hidden;width: 0px;height: 0px;border: 6px solid #ccc;border-color: #ccc #fff; border-width: 6px 6px 0 6px;position: absolute;right: 0;top: 40%;}
  100. /*/////////////////////表单样式/////////////////////// */
  101. /*多行文本框样式(带有限制数字)*/
  102. .msgContbox{border: 1px solid #E5E5E5;background:#fff;min-height:120px;height:auto;position: relative;}
  103. .msgContbox textarea{background:none;border:none;color: #55636D;outline: none;padding:12px;
  104. width: 100%;font-size: 16px;resize:vertical;margin-bottom: 15px;min-height:92px;}
  105. .msgContbox .msgconNum{position:absolute;bottom:2px;right:10px;color:#999;font-size:14px;line-height: 26px;}
  106. .msgContbox .msgconNum>em{font-style: normal;}
  107. /*网站外部表单样式*/
  108. .frmtype{border:none;border:1px #d2d2d2 solid;height:36px;background: #f5f6f8;font-size:14px;outline: none; padding:6px 20px 6px 10px;border-radius: 6px;}
  109. .frmtype:focus{box-shadow: none;outline:none;border:1px solid #28b8fa;}
  110. .frmtypeW{width:98%;margin: auto;}
  111. textarea.frmtype{height:100px;}
  112. .requiredcon{font-style:none;color:red;font-size:16px;margin:0 4px;}/*必填项*/
  113. .emspace{letter-spacing: 2em;}
  114. /*只读状态input*/
  115. input.frmtype[readonly]{background:#EFEFEF;color:#AAAAAA;}
  116. input.frmtype[readonly]:focus{border:1px transparent solid;}
  117. /*网站内部表单样式*/
  118. .frmcontype{border:1px solid #E5E5E5;width:100%;height:40px;background:#FFFFFF;font-size:16px;color:#666;line-height:28px;outline: none; padding:6px 12px;border-radius:0;}
  119. .frmcontype:focus{border-color:#28b8fa;}
  120. .frmconbtn{width:100%;height:40px;background:#28b8fa;font-size:16px;color:#666;line-height:28px;outline:none;border:none;padding:6px 12px;border-radius:0;}
  121. .frmconmsg{color:#fd5f39;margin-left:12px;font-size: 14px;}
  122. /*小按钮*/
  123. .btnModel{display:inline-block;color:#FFFFFF;border:none;background: #FFFFFF; padding:6px 20px;background:#28b8fa;}
  124. .btnModel:hover{background:#1daaeb;}
  125. /*取消按钮*/
  126. .btnCancel{background:#edeff4;}
  127. .btnCancel:hover{background:#d6d8de;}
  128. /*按钮不可用状态*/
  129. button.btnModel[disabled]{background:#d6d8de;}
  130. button.btnModel[disabled]:hover{background:#d6d8de;}
  131. /*大按钮*/
  132. button.btnModelBig{
  133. background: url(../images/business_button_bg.png);background-size:cover;
  134. background: linear-gradient(left,#28b8fa,#558ded);
  135. background: -webkit-gradient(linear, 0% 0%, 100% 0%, from(#28b8fa), to(#558ded));}
  136. button.btnModelBig:hover{
  137. background: url(../images/business_button_bg.png);background-size:cover;
  138. background: linear-gradient(left,#1daaeb,#487fde);
  139. background: -webkit-gradient(linear, 0% 0%, 100% 0%, from(#1daaeb), to(#487fde));}
  140. .save-block{margin:20px auto 40px;padding:6px 40px;}/*保存按钮*/
  141. .fontLink{background:none;border:none;color:#28b8fa;}/*字体链接按钮*/
  142. .limitNum{text-align: right;color:#AAAAAA;}/*限制字数*/
  143. /*表单消息提示*/
  144. .frmmsg{background:url(../images/con_icon_info_warn.png) 0 center no-repeat;background-size: auto 50%;padding-left:18px;line-height:28px;color: #fd5f39;}
  145. .frmmsg-warning{border:1px solid #fd5f39;}
  146. /*色系*/
  147. .cmpBg{background: #28b8fa;color:#FFFFFF;}
  148. .cmpColor{color: #28b8fa;}
  149. .cmpBorder{border-color:#28b8fa;}
  150. /*弹出模态框*/
  151. .blackcover{display:none;overflow-x: hidden;overflow-y:auto;position:fixed;top:0;right:0;bottom:0;left:0; background:rgba(0,0,0,.6);z-index: 1004;}
  152. .modelContain{display:none;position:relative;clear:both;top:20%;margin:40px auto;width:600px;background:#fff;border-radius:8px;z-index:1056;
  153. box-shadow: 2px 4px 10px 4px #555;
  154. -webkit-box-shadow: 2px 4px 10px 4px #555;}
  155. .modelContain:before,.modelContain:after{display:table;content:" "}
  156. .modelContain:after{clear: both;}
  157. .modelClosebtn{position:absolute; top:0; right:-50px; display:block; width:20px; height:20px; background:url(../../images/workclose.png) center center no-repeat; padding:20px;cursor:pointer; z-index:1055;}
  158. .modelOpen{overflow: hidden;}
  159. /*图片在容器中无变形居中显示*//*display: table;table-layout: fixed;*/
  160. .boxBlock{width:200px; height:200px;display: table-cell;vertical-align:middle; text-align:center;overflow: hidden;}
  161. .boxBlockimg{max-width: 100%;max-height: 100%;vertical-align:middle;height:auto !important; overflow-y:auto;}
  162. /*认证标识相关*/
  163. .authicon{display: inline-block;margin-left:4px;background-position: center;background-repeat: no-repeat;}
  164. .authicon-pro{width:16px;height:16px;background-image:url(../images/porfile_icon_zhuanjia_nor.png);background-size: cover;}/*科袖认证专家*/
  165. .authicon-com-ok{width:16px;height:16px;background-image:url(../images/porfile_icon_qiye_hig.png);background-size: cover;}/*认证企业*/
  166. .authicon-com-no{width:16px;height:16px;background-image:url(../images/porfile_icon_qiye_nor.png);background-size: cover;}/*未认证企业*/
  167. .authicon-staff-ok{width:44px;height:16px;background-image:url(../images/porfile_icon_yuangong_hig.png);background-size: cover;}/*企业认证员工*/
  168. .authicon-staff-no{width:44px;height:16px;background-image:url(../images/porfile_icon_yuangong_nor.png);background-size: cover;}/*企业未认证员工*/
  169. .authicon-real{width: 24px;height:16px;background-image:url(../images/porfile_icon_shimin_nor.png);background-size: cover;}/*实名认证用户*/
  170. /*----------------------------分页-----------------------------*/
  171. .tcdPageCode{ padding: 20px; margin: 10px 0;text-align: left;color: #333;text-align:center;font-size:14px;line-height:24px; }
  172. .tcdPageCode a{display: inline-block;height: 30px;line-height: 30px;padding: 0 10px;border: 1px solid #CCCCCC;margin: 0 8px;color:#333;}
  173. .tcdPageCode a:hover{text-decoration: none;}
  174. .tcdPageCode span.current{display: inline-block;height:30px;line-height: 30px;padding: 0 10px;margin: 0 8px;border:1px solid #28b8fa;}
  175. .tcdPageCode span.disabled{ display: inline-block;height: 30px;line-height:30px;padding: 0 10px;margin: 0 8px;color: #ccc;border:1px solid #E5E5E5;}
  176. .tcdPageCode li { display: inline;}
  177. .tcdPageCode a.current{display: inline-block;height:30px;line-height: 30px;padding: 0 10px;margin: 0 8px;border:1px solid #28b8fa;}
  178. /*----------------------------分页------------------------*/
  179. /***********************缺省页面*******************/
  180. .nodatatip{width:40%;margin:100px auto;overflow:hidden;height:100px; font-size:16px; text-align:center;color:#aaa;}
  181. .nodatabox{/*width:100%;*/height: 100%;padding:40px; margin:20px auto;text-align: center;}
  182. .nodatabox .nodata{overflow:hidden; width:50%; margin:20px auto;}
  183. .nodatabox .picbox{margin:8px auto;display:inline-block;width:140px;height:140px;background-position: center;background-repeat: no-repeat;background-size:cover;}
  184. .nodatabox .picbox.picNull{background-image:url(../../images/points_icon_ku_nor.png);}
  185. .nodatabox .txtbox { margin:6px auto;}
  186. .nodatabox .noContip{font-size:18px;color: #999;line-height:40px;}
  187. .nodatabox .keyword{font-size:22px; padding:0 6px;color:#555555;}
  188. /***********************缺省页面*******************/
  189. #container{padding-top:90px;}
  190. .containerCon{width:1120px;padding:0 10px;position:relative; margin:auto;}
  191. .containerCon:before,.containerCon:after{display:table;content:" "}
  192. .containerCon:after{clear: both;}
  193. /*.overInitial{overflow:initial;}*/
  194. /*新版footer*/
  195. footer{position: absolute;right:0; left: 0;bottom:0;background: #373d41;color:#888;font-size:14px;line-height:30px;}
  196. footer .containerCon{background: #373d41;}
  197. footer a{color:#888;text-decoration: none;}
  198. footer p .listlink{margin-right:25px;color:#888;}
  199. footer .bottom-block{padding:30px 0;}
  200. footer .logo-block{width:271px; height:60px;background:url(../images/business_icon_logo_nor.png);background-size:cover;margin-bottom:30px;}
  201. footer .copy-block{color:#666;margin-top:10px;font-size:12px;}
  202. footer .copy-block a{ color:#666;}
  203. footer .copy-block a.beianbox em{display: inline-block;width:14px; height:14px;background:url(../images/home_icon_beian.png);background-size:cover;}
  204. footer .code-block div{text-align: center;}
  205. footer .code-block div:last-child{margin-left:80px;}
  206. footer .codelist{margin:20px auto 10px;width:118px;height:118px;text-align:center;background-position: center center;background-repeat: no-repeat;}
  207. footer .codelist span{display:inline-block;width:94px;height:94px;margin:12px auto; }
  208. footer .appcode{background-image: url(../images/home_bg_xiazaiapp_nor.png);}
  209. footer .appcode span{background-image:url(../images/home_code_app.jpg);background-size: cover;}
  210. footer .weixincode{background-image: url(../images/home_bg_guanzhu_nor.png);}
  211. footer .weixincode span{background-image:url(../images/home_code_weixin.jpg);background-size: cover;}
  212. /*新版header*/
  213. header{ position:fixed; top:0;left:0;right: 0; z-index:1012;font-size:16px;line-height:32px;}
  214. header .navheader{background:#FFFFFF;height:62px;border-bottom: 2px solid #e5e5e5;}
  215. header .navheader.navhdown{background: rgba(256,256,256,1);border-color:#E5E5E5;box-shadow: 0px 2px 12px 0px rgba(204, 204, 204, 0.6);-webkit-box-shadow: 0px 2px 12px 0px rgba(204, 204, 204, 0.6);}
  216. header .navheader.navhdown li a{color:#666;}
  217. header .topheader{background: #333;height:30px;font-size:14px;line-height:30px;}
  218. header .topheader .containerCon{background: #333;}
  219. header .topheader a{padding:0 10px;margin-right:16px;color:#c4c3c3;}
  220. header .topheader a:hover{color:#FFFFFF;}
  221. header .topheader .downicon{background: url(../images/top_icon_shouji_nor.png) 0 center no-repeat;padding-left:18px;}
  222. header .headlogo h1 {width: 60px;height: 30px;margin:15px 14px 15px 0;padding: 0;background-image: url(../images/home_icon_cmplogo.png);background-repeat: no-repeat;background-size:contain;overflow: hidden;}
  223. header .headnav{margin:0 14px;}
  224. header .headnav li{float:left;margin:0 4px; padding:14px 0;}
  225. header .headnav li a{ color:#666; padding:14px 18px;}
  226. header .headuserimg{position:relative;padding: 10px 0 10px 20px; width: 60px;height: 60px;}
  227. header .headuser{overflow: hidden;border:1px solid #E5E5E5; width: 42px;height: 42px;display: table-cell; vertical-align:middle; text-align:center;cursor: pointer;}
  228. header .headuser img{max-width: 40px;max-height: 100%;vertical-align:middle;height:auto !important; overflow-y:auto;}
  229. header .headnavbtn{margin:14px 6px;}
  230. header .headnavbtn a{color:#666;}
  231. header .headnavbtn li{float:right;margin:0 6px;}
  232. header .navbtn{width: 18px;height:20px;cursor: pointer; padding:10px 18px;background-position:center;background-repeat:no-repeat;}
  233. header .navnews{background-image: url(../images/nav_button_news_nor.png);background-size:contain;}
  234. header .navsearch{background-image: url(../images/nav_button_search_nor_2.png);background-size:contain;}
  235. header .navheader li a:hover{color:#28b8fa;}
  236. header .navheader li.navcurrent a{color:#28b8fa;}
  237. header .comuserSelf{width:180px; height:180px; position:absolute; top:42px; right:0;z-index: 100;}
  238. header .triangleB{ display:block; width:0; height:0; border:8px solid transparent; border-bottom-color:#28b8fa; float:right; margin-right:12px; margin-top:14px;}
  239. header .personal-box{ width:100%;background:#28b8fa; clear:both; overflow:hidden;}
  240. header .personal-box a{ display:block; width:100%; height:40px;line-height:40px; font-size: 13px; color:#fff;}
  241. header .personal-box a:hover{ background:#17a4e4;}
  242. header .icon{ display:block; width:20px; height:20px; margin-left:15px; margin-right:12px; margin-top:10px; float:left;}
  243. header .icon3{ background:url(../images/index-icon.png) no-repeat; background-position:-40px 0;}
  244. header .icon4{ background:url(../images/index-icon.png) no-repeat; background-position:-20px 0;}