收费管理系统

image.css 19KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936
  1. @charset "utf-8";
  2. /* dialog样式 */
  3. .wrapper {
  4. zoom: 1;
  5. width: 600px;
  6. height: 412px;
  7. margin: 0 auto;
  8. padding: 20px;
  9. position: relative;
  10. font-family: sans-serif;
  11. }
  12. /*tab样式框大小*/
  13. .tabhead {
  14. float:left;
  15. }
  16. .tabbody {
  17. width: 100%;
  18. height: 346px;
  19. position: relative;
  20. clear: both;
  21. }
  22. .tabbody .panel {
  23. position: absolute;
  24. width: 0;
  25. height: 0;
  26. background: #fff;
  27. overflow: hidden;
  28. display: none;
  29. }
  30. .tabbody .panel.focus {
  31. width: 100%;
  32. height: 380px;
  33. display: block;
  34. }
  35. /* 图片对齐方式 */
  36. .alignBar{
  37. float:right;
  38. margin-top: 5px;
  39. position: relative;
  40. }
  41. .alignBar .algnLabel{
  42. float:left;
  43. height: 20px;
  44. line-height: 20px;
  45. }
  46. .alignBar #alignIcon{
  47. zoom:1;
  48. _display: inline;
  49. display: inline-block;
  50. position: relative;
  51. }
  52. .alignBar #alignIcon span{
  53. float: left;
  54. cursor: pointer;
  55. display: block;
  56. width: 19px;
  57. height: 17px;
  58. margin-right: 3px;
  59. margin-left: 3px;
  60. background-image: url(./images/alignicon.jpg);
  61. }
  62. .alignBar #alignIcon .none-align{
  63. background-position: 0 -18px;
  64. }
  65. .alignBar #alignIcon .left-align{
  66. background-position: -20px -18px;
  67. }
  68. .alignBar #alignIcon .right-align{
  69. background-position: -40px -18px;
  70. }
  71. .alignBar #alignIcon .center-align{
  72. background-position: -60px -18px;
  73. }
  74. .alignBar #alignIcon .none-align.focus{
  75. background-position: 0 0;
  76. }
  77. .alignBar #alignIcon .left-align.focus{
  78. background-position: -20px 0;
  79. }
  80. .alignBar #alignIcon .right-align.focus{
  81. background-position: -40px 0;
  82. }
  83. .alignBar #alignIcon .center-align.focus{
  84. background-position: -60px 0;
  85. }
  86. /* 远程图片样式 */
  87. #remote {
  88. z-index: 200;
  89. }
  90. #remote .top{
  91. width: 100%;
  92. margin-top: 20px;
  93. }
  94. #remote .left{
  95. display: block;
  96. float: left;
  97. width: 240px;
  98. height:10px;
  99. }
  100. #remote .right{
  101. display: block;
  102. float: right;
  103. width: 345px;
  104. height:10px;
  105. }
  106. #remote .row{
  107. /*margin-left: 20px;*/
  108. display: flex;
  109. clear: both;
  110. height: 30px;
  111. line-height: 30px;
  112. margin-bottom: 20px;
  113. }
  114. #remote .row label{
  115. text-align: center;
  116. width: 50px;
  117. zoom:1;
  118. _display: inline;
  119. display:inline-block;
  120. vertical-align: middle;
  121. margin-right: 10px;
  122. }
  123. #remote .row label.algnLabel{
  124. float: left;
  125. }
  126. #remote input.text{
  127. height: 28px;
  128. width: 150px;
  129. font-size: 14px;
  130. line-height: 1.42857143;
  131. color: #555;
  132. background-color: #fff;
  133. background-image: none;
  134. border: 1px solid #ccc;
  135. border-radius: 4px;
  136. -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  137. box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  138. -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  139. transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  140. }
  141. #remote input.text:focus {
  142. border-color: #66afe9;
  143. outline: 0;
  144. -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
  145. box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
  146. }
  147. #remote textarea.text{
  148. width: 160px;
  149. height: 120px;
  150. font-size: 14px;
  151. line-height: 1.42857143;
  152. color: #555;
  153. background-color: #fff;
  154. background-image: none;
  155. border: 1px solid #ccc;
  156. border-radius: 4px;
  157. -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  158. box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  159. -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  160. transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  161. resize: none;
  162. }
  163. #remote textarea.text:focus {
  164. border-color: #66afe9;
  165. outline: 0;
  166. -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
  167. box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
  168. }
  169. #remote #url{
  170. width: 537px;
  171. height: 28px;
  172. }
  173. #remote #width,
  174. #remote #height{
  175. width: 60px;
  176. height: 28px;
  177. margin-left: 8px;
  178. margin-right: 8px;
  179. }
  180. #remote .top .row:nth-child(2) span:nth-child(1) ,
  181. #remote .top .row:nth-child(2) span:nth-child(2) {
  182. display: block;
  183. margin-right: 18px;
  184. }
  185. #remote .top .row:nth-child(2) span:last-child {
  186. margin-left: 15px;
  187. }
  188. #remote #border,
  189. #remote #vhSpace,
  190. #remote #title{
  191. width: 145px;
  192. margin-right: 8px;
  193. }
  194. #remote #lock{
  195. margin-top: 11px;
  196. }
  197. #remote #lockicon{
  198. zoom: 1;
  199. _display:inline;
  200. display: inline-block;
  201. height: 20px;
  202. background: url("../../themes/notadd/images/lock.gif") -13px -13px no-repeat;
  203. vertical-align: middle;
  204. }
  205. #remote #preview{
  206. clear: both;
  207. width: 345px;
  208. height: 261px;
  209. z-index: 9999;
  210. background-color: #f3f3f3;
  211. overflow: hidden;
  212. }
  213. /* 上传图片 */
  214. .tabbody #upload.panel {
  215. width: 0;
  216. height: 0;
  217. overflow: hidden;
  218. position: absolute !important;
  219. clip: rect(1px, 1px, 1px, 1px);
  220. background: #fff;
  221. display: block;
  222. }
  223. .tabbody #upload.panel.focus {
  224. width: 100%;
  225. height: 373px;
  226. display: block;
  227. clip: auto;
  228. margin-top: 12px;
  229. }
  230. #upload .queueList {
  231. margin: 0;
  232. width: 100%;
  233. height: 100%;
  234. position: absolute;
  235. overflow: hidden;
  236. }
  237. #upload p {
  238. margin: 0;
  239. }
  240. .element-invisible {
  241. width: 0 !important;
  242. height: 0 !important;
  243. border: 0;
  244. padding: 0;
  245. margin: 0;
  246. overflow: hidden;
  247. position: absolute !important;
  248. clip: rect(1px, 1px, 1px, 1px);
  249. }
  250. #upload .placeholder {
  251. margin: 10px;
  252. height: 212px;
  253. padding-top: 160px;
  254. text-align: center;
  255. /*background: url(./images/image.png) center 130px no-repeat #f3f3f3;*/
  256. background-color: #f3f3f3;
  257. color: #cccccc;
  258. font-size: 18px;
  259. position: relative;
  260. top: 0;
  261. }
  262. #upload .placeholder .webuploader-pick {
  263. font-size: 16px;
  264. background: #f3f3f3;
  265. border-radius: 3px;
  266. line-height: 44px;
  267. padding: 0 30px;
  268. color: #646464;
  269. display: inline-block;
  270. margin: 0 auto 20px auto;
  271. cursor: pointer;
  272. /* box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); */
  273. border: 1px solid #ccc;
  274. }
  275. #upload .placeholder .webuploader-pick-hover {
  276. border: 1px solid #00a2d4;
  277. color: #00a2d4;
  278. }
  279. #filePickerContainer {
  280. text-align: center;
  281. }
  282. #upload .placeholder .flashTip {
  283. color: #666666;
  284. font-size: 12px;
  285. position: absolute;
  286. width: 100%;
  287. text-align: center;
  288. bottom: 20px;
  289. }
  290. #upload .placeholder .flashTip a {
  291. color: #0785d1;
  292. text-decoration: none;
  293. }
  294. #upload .placeholder .flashTip a:hover {
  295. text-decoration: underline;
  296. }
  297. #upload .placeholder.webuploader-dnd-over {
  298. border-color: #999999;
  299. }
  300. #upload .filelist {
  301. list-style: none;
  302. margin: 0;
  303. padding: 0;
  304. overflow-x: hidden;
  305. overflow-y: auto;
  306. position: relative;
  307. height: 300px;
  308. }
  309. #upload .filelist:after {
  310. content: '';
  311. display: block;
  312. width: 0;
  313. height: 0;
  314. overflow: hidden;
  315. clear: both;
  316. position: relative;
  317. }
  318. #upload .filelist li {
  319. width: 135px;
  320. height: 135px;
  321. background: url(./images/bg.png);
  322. text-align: center;
  323. margin: 9px 0 0 9px;
  324. *margin: 6px 0 0 6px;
  325. position: relative;
  326. display: block;
  327. float: left;
  328. overflow: hidden;
  329. font-size: 12px;
  330. }
  331. #upload .filelist li p.log {
  332. position: relative;
  333. top: -45px;
  334. }
  335. #upload .filelist li p.title {
  336. position: absolute;
  337. top: 0;
  338. left: 0;
  339. width: 100%;
  340. overflow: hidden;
  341. white-space: nowrap;
  342. text-overflow: ellipsis;
  343. top: 5px;
  344. text-indent: 5px;
  345. text-align: left;
  346. }
  347. #upload .filelist li p.progress {
  348. position: absolute;
  349. width: 100%;
  350. bottom: 0;
  351. left: 0;
  352. height: 8px;
  353. overflow: hidden;
  354. z-index: 50;
  355. margin: 0;
  356. border-radius: 0;
  357. background: none;
  358. -webkit-box-shadow: 0 0 0;
  359. }
  360. #upload .filelist li p.progress span {
  361. display: none;
  362. overflow: hidden;
  363. width: 0;
  364. height: 100%;
  365. background: #1483d8 url(./images/progress.png) repeat-x;
  366. -webit-transition: width 200ms linear;
  367. -moz-transition: width 200ms linear;
  368. -o-transition: width 200ms linear;
  369. -ms-transition: width 200ms linear;
  370. transition: width 200ms linear;
  371. -webkit-animation: progressmove 2s linear infinite;
  372. -moz-animation: progressmove 2s linear infinite;
  373. -o-animation: progressmove 2s linear infinite;
  374. -ms-animation: progressmove 2s linear infinite;
  375. animation: progressmove 2s linear infinite;
  376. -webkit-transform: translateZ(0);
  377. }
  378. @-webkit-keyframes progressmove {
  379. 0% {
  380. background-position: 0 0;
  381. }
  382. 100% {
  383. background-position: 17px 0;
  384. }
  385. }
  386. @-moz-keyframes progressmove {
  387. 0% {
  388. background-position: 0 0;
  389. }
  390. 100% {
  391. background-position: 17px 0;
  392. }
  393. }
  394. @keyframes progressmove {
  395. 0% {
  396. background-position: 0 0;
  397. }
  398. 100% {
  399. background-position: 17px 0;
  400. }
  401. }
  402. #upload .filelist li p.imgWrap {
  403. position: relative;
  404. z-index: 2;
  405. line-height: 135px;
  406. vertical-align: middle;
  407. overflow: hidden;
  408. width: 135px;
  409. height: 135px;
  410. -webkit-transform-origin: 50% 50%;
  411. -moz-transform-origin: 50% 50%;
  412. -o-transform-origin: 50% 50%;
  413. -ms-transform-origin: 50% 50%;
  414. transform-origin: 50% 50%;
  415. -webit-transition: 200ms ease-out;
  416. -moz-transition: 200ms ease-out;
  417. -o-transition: 200ms ease-out;
  418. -ms-transition: 200ms ease-out;
  419. transition: 200ms ease-out;
  420. }
  421. #upload .filelist li img {
  422. width: 100%;
  423. }
  424. #upload .filelist li p.error {
  425. background: #f43838;
  426. color: #fff;
  427. position: absolute;
  428. bottom: 0;
  429. left: 0;
  430. height: 28px;
  431. line-height: 28px;
  432. width: 100%;
  433. z-index: 100;
  434. display:none;
  435. }
  436. #upload .filelist li .success {
  437. display: block;
  438. position: absolute;
  439. left: 0;
  440. bottom: 0;
  441. height: 40px;
  442. width: 100%;
  443. z-index: 200;
  444. background: url(../fonts/images/selected.svg) no-repeat right bottom;
  445. }
  446. #upload .filelist li.filePickerBlock {
  447. width: 135px;
  448. height: 135px;
  449. background: url(../fonts/images/addfile.svg) no-repeat center;
  450. border: 1px solid #eeeeee;
  451. border-radius: 0;
  452. }
  453. #upload .filelist li.filePickerBlock div.webuploader-pick {
  454. width: 100%;
  455. height: 100%;
  456. margin: 0;
  457. padding: 0;
  458. opacity: 0;
  459. background: none;
  460. font-size: 0;
  461. }
  462. #upload .filelist div.file-panel {
  463. position: absolute;
  464. height: 0;
  465. filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#80000000', endColorstr='#80000000') \0;
  466. background: rgba(0, 0, 0, 0.5);
  467. width: 100%;
  468. top: 0;
  469. left: 0;
  470. overflow: hidden;
  471. z-index: 300;
  472. }
  473. #upload .filelist div.file-panel span {
  474. width: 24px;
  475. height: 24px;
  476. display: inline;
  477. float: right;
  478. text-indent: -9999px;
  479. overflow: hidden;
  480. background: url(./images/icons.png) no-repeat;
  481. background: url(./images/icons.gif) no-repeat \9;
  482. margin: 5px 1px 1px;
  483. cursor: pointer;
  484. -webkit-tap-highlight-color: rgba(0,0,0,0);
  485. -webkit-user-select: none;
  486. -moz-user-select: none;
  487. -ms-user-select: none;
  488. user-select: none;
  489. }
  490. #upload .filelist div.file-panel span.rotateLeft {
  491. display:none;
  492. background-position: 0 -24px;
  493. }
  494. #upload .filelist div.file-panel span.rotateLeft:hover {
  495. background-position: 0 0;
  496. }
  497. #upload .filelist div.file-panel span.rotateRight {
  498. display:none;
  499. background-position: -24px -24px;
  500. }
  501. #upload .filelist div.file-panel span.rotateRight:hover {
  502. background-position: -24px 0;
  503. }
  504. #upload .filelist div.file-panel span.cancel {
  505. background-position: -48px -24px;
  506. }
  507. #upload .filelist div.file-panel span.cancel:hover {
  508. background-position: -48px 0;
  509. }
  510. #upload .statusBar {
  511. height: 45px;
  512. border-bottom: 1px solid #dadada;
  513. margin: 0 10px;
  514. padding: 0;
  515. line-height: 45px;
  516. vertical-align: middle;
  517. position: relative;
  518. }
  519. #upload .statusBar .progress {
  520. border: 1px solid #1483d8;
  521. width: 198px;
  522. background: #fff;
  523. height: 18px;
  524. position: absolute;
  525. top: 12px;
  526. display: none;
  527. text-align: center;
  528. line-height: 18px;
  529. color: #6dbfff;
  530. margin: 0 10px 0 0;
  531. }
  532. #upload .statusBar .progress span.percentage {
  533. width: 0;
  534. height: 100%;
  535. left: 0;
  536. top: 0;
  537. background: #1483d8;
  538. position: absolute;
  539. }
  540. #upload .statusBar .progress span.text {
  541. position: relative;
  542. z-index: 10;
  543. }
  544. #upload .statusBar .info {
  545. display: inline-block;
  546. font-size: 14px;
  547. color: #666666;
  548. }
  549. #upload .statusBar .btns {
  550. position: absolute;
  551. top: 7px;
  552. right: 0;
  553. line-height: 30px;
  554. }
  555. #filePickerBtn {
  556. display: inline-block;
  557. float: left;
  558. }
  559. #upload .statusBar .btns .webuploader-pick,
  560. #upload .statusBar .btns .uploadBtn,
  561. #upload .statusBar .btns .uploadBtn.state-uploading,
  562. #upload .statusBar .btns .uploadBtn.state-paused {
  563. background: #ffffff;
  564. border: 1px solid #cfcfcf;
  565. color: #565656;
  566. padding: 0 18px;
  567. display: inline-block;
  568. border-radius: 3px;
  569. margin-left: 10px;
  570. cursor: pointer;
  571. font-size: 14px;
  572. float: left;
  573. -webkit-user-select: none;
  574. -moz-user-select: none;
  575. -ms-user-select: none;
  576. user-select: none;
  577. }
  578. #upload .statusBar .btns .webuploader-pick-hover,
  579. #upload .statusBar .btns .uploadBtn:hover,
  580. #upload .statusBar .btns .uploadBtn.state-uploading:hover,
  581. #upload .statusBar .btns .uploadBtn.state-paused:hover {
  582. background: #f0f0f0;
  583. }
  584. #upload .statusBar .btns .uploadBtn,
  585. #upload .statusBar .btns .uploadBtn.state-paused{
  586. background: #00b7ee;
  587. color: #fff;
  588. border-color: transparent;
  589. }
  590. #upload .statusBar .btns .uploadBtn:hover,
  591. #upload .statusBar .btns .uploadBtn.state-paused:hover{
  592. background: #00a2d4;
  593. }
  594. #upload .statusBar .btns .uploadBtn.disabled {
  595. pointer-events: none;
  596. filter:alpha(opacity=60);
  597. -moz-opacity:0.6;
  598. -khtml-opacity: 0.6;
  599. opacity: 0.6;
  600. }
  601. /* 图片管理样式 */
  602. #online {
  603. width: 100%;
  604. height: 336px;
  605. padding: 10px 0 0 0;
  606. }
  607. #online #imageList{
  608. width: 100%;
  609. height: 100%;
  610. overflow-x: hidden;
  611. overflow-y: auto;
  612. position: relative;
  613. }
  614. #online ul {
  615. display: block;
  616. list-style: none;
  617. margin: 0;
  618. padding: 0;
  619. }
  620. #online li {
  621. float: left;
  622. display: block;
  623. list-style: none;
  624. padding: 0;
  625. width: 135px;
  626. height: 135px;
  627. margin: 0 0 9px 9px;
  628. *margin: 0 0 6px 6px;
  629. background-color: #eee;
  630. overflow: hidden;
  631. cursor: pointer;
  632. position: relative;
  633. }
  634. #online li.clearFloat {
  635. float: none;
  636. clear: both;
  637. display: block;
  638. width:0;
  639. height:0;
  640. margin: 0;
  641. padding: 0;
  642. }
  643. #online li img {
  644. cursor: pointer;
  645. width: 135px !important;
  646. height: 135px !important;
  647. margin-top: 0px !important;
  648. }
  649. #online li .icon {
  650. cursor: pointer;
  651. width: 135px;
  652. height: 135px;
  653. position: absolute;
  654. top: 0;
  655. left: 0;
  656. z-index: 2;
  657. border: 0;
  658. background-repeat: no-repeat;
  659. }
  660. #online li .icon:hover {
  661. width: 129px;
  662. height: 129px;
  663. border: 3px solid #1094fa;
  664. }
  665. #online li.selected .icon {
  666. background-image: url(images/success.png);
  667. background-image: url(images/success.gif)\9;
  668. background-position: 95px 95px;
  669. }
  670. #online li.selected .icon:hover {
  671. width: 129px;
  672. height: 129px;
  673. border: 3px solid #1094fa;
  674. background-position: 92px 92px;
  675. }
  676. /* 图片搜索样式 */
  677. #search .searchBar {
  678. width: 100%;
  679. height: 30px;
  680. margin: 10px 0 5px 0;
  681. padding: 0;
  682. }
  683. #search input.text{
  684. width: 150px;
  685. padding: 3px 6px;
  686. font-size: 14px;
  687. line-height: 1.42857143;
  688. color: #555;
  689. background-color: #fff;
  690. background-image: none;
  691. border: 1px solid #ccc;
  692. border-radius: 4px;
  693. -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  694. box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  695. -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  696. transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  697. }
  698. #search input.text:focus {
  699. border-color: #66afe9;
  700. outline: 0;
  701. -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
  702. box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
  703. }
  704. #search input.searchTxt {
  705. margin-left:5px;
  706. padding-left: 5px;
  707. background: #FFF;
  708. width: 300px;
  709. *width: 260px;
  710. height: 21px;
  711. line-height: 21px;
  712. float: left;
  713. dislay: block;
  714. }
  715. #search .pagination{
  716. margin-top: 5px;
  717. }
  718. #search input.num{
  719. width: 80px;
  720. }
  721. #search .searchType {
  722. width: 95px;
  723. height: 28px;
  724. padding:0;
  725. line-height: 28px;
  726. border: 1px solid #d7d7d7;
  727. border-radius: 0;
  728. vertical-align: top;
  729. margin-left: 5px;
  730. float: left;
  731. dislay: block;
  732. }
  733. #search #searchBtn,
  734. #search #searchReset {
  735. display: inline-block;
  736. margin-bottom: 0;
  737. margin-right: 5px;
  738. padding: 4px 10px;
  739. font-weight: 400;
  740. text-align: center;
  741. vertical-align: middle;
  742. cursor: pointer;
  743. background-image: none;
  744. border: 1px solid transparent;
  745. white-space: nowrap;
  746. font-size: 14px;
  747. border-radius: 4px;
  748. -webkit-user-select: none;
  749. -moz-user-select: none;
  750. -ms-user-select: none;
  751. user-select: none;
  752. vertical-align: top;
  753. float: right;
  754. }
  755. #search #searchBtn {
  756. color: white;
  757. border-color: #285e8e;
  758. background-color: #3b97d7;
  759. }
  760. #search #searchReset {
  761. color: #333;
  762. border-color: #ccc;
  763. background-color: #fff;
  764. }
  765. #search #searchBtn:hover {
  766. background-color: #3276b1;
  767. }
  768. #search #searchReset:hover {
  769. background-color: #eee;
  770. }
  771. #search .msg {
  772. margin-left: 5px;
  773. }
  774. #search .searchList{
  775. width: 100%;
  776. height: 300px;
  777. overflow: hidden;
  778. clear: both;
  779. }
  780. #search .searchList ul{
  781. margin:0;
  782. padding:0;
  783. list-style:none;
  784. clear: both;
  785. width: 100%;
  786. height: 100%;
  787. overflow-x: hidden;
  788. overflow-y: auto;
  789. zoom: 1;
  790. position: relative;
  791. }
  792. #search .searchList li {
  793. list-style:none;
  794. float: left;
  795. display: block;
  796. width: 115px;
  797. margin: 5px 10px 5px 20px;
  798. *margin: 5px 10px 5px 15px;
  799. padding:0;
  800. font-size: 12px;
  801. box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
  802. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
  803. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
  804. position: relative;
  805. vertical-align: top;
  806. text-align: center;
  807. overflow: hidden;
  808. cursor: pointer;
  809. filter: alpha(Opacity=100);
  810. -moz-opacity: 1;
  811. opacity: 1;
  812. border: 2px solid #eee;
  813. }
  814. #search .searchList li.selected {
  815. filter: alpha(Opacity=40);
  816. -moz-opacity: 0.4;
  817. opacity: 0.4;
  818. border: 2px solid #00a0e9;
  819. }
  820. #search .searchList li p {
  821. background-color: #eee;
  822. margin: 0;
  823. padding: 0;
  824. position: relative;
  825. width:100%;
  826. height:115px;
  827. overflow: hidden;
  828. }
  829. #search .searchList li p img {
  830. cursor: pointer;
  831. border: 0;
  832. }
  833. #search .searchList li a {
  834. color: #999;
  835. border-top: 1px solid #F2F2F2;
  836. background: #FAFAFA;
  837. text-align: center;
  838. display: block;
  839. padding: 0 5px;
  840. width: 105px;
  841. height:32px;
  842. line-height:32px;
  843. white-space:nowrap;
  844. text-overflow:ellipsis;
  845. text-decoration: none;
  846. overflow: hidden;
  847. word-break: break-all;
  848. }
  849. #search .searchList a:hover {
  850. text-decoration: underline;
  851. color: #333;
  852. }
  853. #search .searchList .clearFloat{
  854. clear: both;
  855. }