##CSS样式（webuploader中添加styl.css样式）
```
body {
margin-top: 50px;
font-size: 16px;
font-family: "Myriad Pro", "Hiragino Sans GB","Microsoft YaHei","微软雅黑", Calibri, Helvetica, tahoma,arial,simsun,"宋体", sans-serif;
line-height: 1.5;
-webkit-font-smoothing: antialiased;
}
.jumbotron {
background: transparent url(../images/banner.jpg) repeat-x 50% 0%;
color: #fff;
text-shadow: 1px 1px 1px #3b3262;
margin-bottom: 0;
}
.jumbotron .container {
position: relative;
}
.jumbotron .github-btns {
position: absolute;
bottom: 0;
right: 0;
}
.fetature {
margin-top: 30px;
}
.page-body {
min-height: 450px;
}
.page-container {
margin-top: 10px;
}
.page-container h1,
.page-container h2,
.page-container h3 {
padding-top: 70px;
margin-top: -50px;
}
.logo {
position: relative;
padding-left: 60px;
}
.logo span {
position: absolute;
left: 15px;
top: 8px;
font-size: 2em;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.logo.active {
color: #fff;
}
@media (min-width: 768px) {
.fetature .row .col-lg-4 {
min-height: 250px;
}
}
.footer {
width: 100%;
overflow: hidden;
color: #f2f2f2;
background: #212121;
margin-top: 50px;
}
.footer-fixed-bottom {
position: fixed;
bottom: 0;
}
.footer a {
color: #f2f2f2;
}
.footer .footer-inner {
margin: 15px;
}
.wu-example {
position: relative;
padding: 45px 15px 15px;
margin: 15px 0;
background-color: #fafafa;
box-shadow: inset 0 3px 6px rgba(0, 0, 0, .05);
border-color: #e5e5e5 #eee #eee;
border-style: solid;
border-width: 1px 0;
}
.wu-example:after {
content:"示例";
position: absolute;
top: 15px;
left: 15px;
font-size: 12px;
font-weight: bold;
color: #bbb;
text-transform: uppercase;
letter-spacing: 1px;
}
@media (min-width: 768px) {
.bs-example {
margin-left: 0;
margin-right: 0;
background-color: #fff;
border-width: 1px;
border-color: #ddd;
border-radius: 4px 4px 0 0;
box-shadow: none;
}
}
.post-toc {
margin-top: 30px;
margin-bottom: 30px;
padding-top: 10px;
padding-bottom: 10px;
text-shadow: 0 1px 0 #fff;
background-color: #f7f5fa;
border-radius: 5px;
}
.post-toc .nav > li > a {
display: block;
color: #716b7a;
padding: 5px 20px;
}
.post-toc .nav .nav > li > a {
padding-top: 3px;
padding-bottom: 3px;
padding-left: 30px;
font-size: 90%;
}
.post-toc.affix {
position: static;
}
.post-toc .nav .nav {
display: none;
margin-bottom: 8px;
}
@media (min-width: 992px) {
.post-toc.affix {
position: fixed;
width: 213px;
top: 50px;
}
.post-toc .nav > .active > ul {
display: block;
}
}
@media (min-width: 1200px) {
.post-toc.affix {
width: 263px;
}
.post-toc .nav > .active > ul {
display: block;
}
}
.post-toc .nav > .active > a,
.post-toc .nav > .active:hover > a,
.post-toc .nav > .active:focus > a {
font-weight: bold;
color: #563d7c;
background-color: transparent;
border-right: 1px solid #563d7c;
}
.friends-links {
margin: 0;
padding: 0;
list-style: none;
}
.weixin {
text-align: center;
display: inline-block;
}
.weixin img {
width: 80px;
}
/********************************
*
* COMMENTS
*
********************************/
.comment {
background-color: transparent;
border-color: #CACACA;
border-style: solid;
border-width: 1px;
color: black;
display: block;
margin-bottom: 10px;
margin-top: 10px;
padding: 0px;
width: 100%;
}
.comment .commentheader {
border-bottom-color: #CACACA;
border-bottom-style: solid;
border-bottom-width: 1px;
color: black;
background-image: -webkit-linear-gradient(#F8F8F8,#E1E1E1);
background-image: -moz-linear-gradient(#F8F8F8,#E1E1E1);
color: black;
display: block;
float: left;
font-family: helvetica, arial, freesans, clean, sans-serif;
font-size: 12px;
font-style: normal;
font-variant: normal;
font-weight: normal;
height: 33px;
line-height: 33px;
margin: 0px;
overflow-x: hidden;
overflow-y: hidden;
padding: 0px;
text-overflow: ellipsis;
text-shadow: rgba(255, 255, 255, 0.699219) 1px 1px 0px;
white-space: nowrap;
width: 100%;
}
.comment .commentheader .commentgravatar {
background-attachment: scroll;
background-clip: border-box;
background-color: white;
background-image: none;
background-origin: padding-box;
border-color: #C8C8C8;
border-style: solid;
border-width: 1px;
color: black;
display: inline-block;
float: none;
font-family: helvetica, arial, freesans, clean, sans-serif;
font-size: 1px;
font-style: normal;
font-variant: normal;
font-weight: normal;
height: 24px;
line-height: 1px;
margin-left: 5px;
margin-right: 3px;
margin-top: -2px;
overflow-x: visible;
overflow-y: visible;
padding: 1px;
text-overflow: clip;
text-shadow: rgba(255, 255, 255, 0.699219) 1px 1px 0px;
vertical-align: middle;
white-space: nowrap;
width: 24px;
}
.comment .commentheader a:link {
text-decoration: none;
}
.comment .commentheader a:hover {
border-bottom:1px solid;
}
.comment .commentheader .commentuser {
background-color: transparent;
color: black;
display: inline;
float: none;
font-family: helvetica, arial, freesans, clean, sans-serif;
font-size: 12px;
font-style: normal;
font-variant: normal;
font-weight: bold;
height: 0px;
line-height: 16px;
margin-left: 5px;
margin-right: 10px;
overflow-x: visible;
overflow-y: visible;
padding: 0px;
text-overflow: clip;
text-shadow: rgba(255, 255, 255, 0.699219) 1px 1px 0px;
white-space: nowrap;
width: 0px;
}
.comment .commentheader .commentdate {
background-color: transparent;
color: #777;
display: inline;
float: none;
font-family: helvetica, arial, freesans, clean, sans-serif;
font-size: 11px;
font-style: normal;
font-variant: normal;
font-weight: normal;
height: 0px;
line-height: 33px;
margin: 0px;
overflow-x: visible;
overflow-y: visible;
padding: 0px;
text-overflow: clip;
text-shadow: rgba(255, 255, 255, 0.699219) 1px 1px 0px;
white-space: nowrap;
width: 20em;
}
.comment .commentbody {
background-attachment: scroll;
background-clip: border-box;
background-color: transparent;
background-image: none;
background-origin: padding-box;
color: #333;
display: block;
margin-bottom: 1em;
margin-left: 1em;
margin-right: 1em;
margin-top: 40px;
overflow-x: visible;
overflow-y: visible;
padding: 0em;
position: static;
width: 96%;
word-wrap: break-word;
}
.comment .commentbody p {
margin-bottom: 0.5em;
margin-top: 0.5em;
margin-left: 0em;
margin-right: 0em;
}
.comment .commentbody pre {
border: 0px solid #ddd;
background-color: #eef;
padding: 0 .4em;
}
.comment .commentbody pre code {
border: 0px solid #ddd;
}
.comment .commentbody code {
border: 1px solid #ddd;
background-color: #eef;
font-size: 85%;
padding: 0 .2em;
}
/*demo样式*/
#picker {
display: inline-block;
line-height: 1.428571429;
vertical-align: middle;
margin: 0 12px 0 0;
}
#picker .webuploader-pick {
padding: 6px 12px;
display: block;
}
#uploader-demo .thumbnail {
width: 110px;
height: 110px;
}
#uploader-demo .thumbnail img {
width: 100%;
}
.uploader-list {
width: 100%;
overflow: hidden;
}
.file-item {
float: left;
position: relative;
margin: 0 20px 20px 0;
padding: 4px;
}
.file-item .error {
position: absolute;
top: 4px;
left: 4px;
right: 4px;
background: red;
color: white;
text-align: center;
height: 20px;
font-size: 14px;
line-height: 23px;
}
.file-item .info {
position: absolute;
left: 4px;
bottom: 4px;
right: 4px;
height: 20px;
line-height: 20px;
text-indent: 5px;
background: rgba(0, 0, 0, 0.6);
color: white;
overflow: hidden;
white-space: nowrap;
text-overflow : ellipsis;
font-size: 12px;
z-index: 10;
}
.upload-state-done:after {
content:"\f00c";
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 32px;
position: absolute;
bottom: 0;
right: 4px;
color: #4cae4c;
z-index: 99;
}
.file-item .progress {
position: absolute;
right: 4px;
bottom: 4px;
height: 3px;
left: 4px;
height: 4px;
overflow: hidden;
z-index: 15;
margin:0;
padding: 0;
border-radius: 0;
background: transparent;
}
.file-item .progress span {
display: block;
overflow: hidden;
width: 0;
height: 100%;
background: #d14 url(../images/progress.png) repeat-x;
-webit-transition: width 200ms linear;
-moz-transition: width 200ms linear;
-o-transition: width 200ms linear;
-ms-transition: width 200ms linear;
transition: width 200ms linear;
-webkit-animation: progressmove 2s linear infinite;
-moz-animation: progressmove 2s linear infinite;
-o-animation: progressmove 2s linear infinite;
-ms-animation: progressmove 2s linear infinite;
animation: progressmove 2s linear infinite;
-webkit-transform: translateZ(0);
}
@-webkit-keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
@-moz-keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
@keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
a.travis {
position: relative;
top: -4px;
right: 15px;
}
```
##webuploader.css样式内容
```
.webuploader-container {
position: relative;
}
.webuploader-element-invisible {
position: absolute !important;
clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
clip: rect(1px,1px,1px,1px);
}
.webuploader-pick {
position: relative;
display: inline-block;
cursor: pointer;
background: #00b7ee;
padding: 10px 15px;
color: #fff;
text-align: center;
border-radius: 3px;
overflow: hidden;
}
.webuploader-pick-hover {
background: #00a2d4;
}
.webuploader-pick-disable {
opacity: 0.6;
pointer-events:none;
}
/* ----------------Reset Css--------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video, input {
margin: 0;
padding: 0;
border: none;
outline: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 {
-webkit-text-size-adjust: none;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
body {
font-family: arial, sans-serif;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/* ------------ */
#wrapper {
width: 100%;
margin: 0 auto;
margin: 1em;
width: auto;
}
#container {
border: 1px solid #dadada;
color: #838383;
font-size: 12px;
margin-top: 10px;
background-color: #FFF;
}
#uploader .queueList {
margin: 20px;
}
.element-invisible {
position: absolute !important;
clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
clip: rect(1px,1px,1px,1px);
}
#uploader .placeholder {
border: 3px dashed #e6e6e6;
min-height: 238px;
padding-top: 158px;
text-align: center;
background: url(image.png) center 93px no-repeat;
color: #cccccc;
font-size: 18px;
position: relative;
}
#uploader .placeholder .webuploader-pick {
font-size: 18px;
background: #00b7ee;
border-radius: 3px;
line-height: 44px;
padding: 0 30px;
color: #fff;
display: inline-block;
margin: 20px auto;
cursor: pointer;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}
#uploader .placeholder .webuploader-pick-hover {
background: #00a2d4;
}
#uploader .placeholder .flashTip {
color: #666666;
font-size: 12px;
position: absolute;
width: 100%;
text-align: center;
bottom: 20px;
}
#uploader .placeholder .flashTip a {
color: #0785d1;
text-decoration: none;
}
#uploader .placeholder .flashTip a:hover {
text-decoration: underline;
}
#uploader .placeholder.webuploader-dnd-over {
border-color: #999999;
}
#uploader .placeholder.webuploader-dnd-over.webuploader-dnd-denied {
border-color: red;
}
#uploader .filelist {
list-style: none;
margin: 0;
padding: 0;
}
#uploader .filelist:after {
content: '';
display: block;
width: 0;
height: 0;
overflow: hidden;
clear: both;
}
#uploader .filelist li {
width: 110px;
height: 110px;
background: url(bg.png) no-repeat;
text-align: center;
margin: 0 8px 20px 0;
position: relative;
display: inline;
float: left;
overflow: hidden;
font-size: 12px;
}
#uploader .filelist li p.log {
position: relative;
top: -45px;
}
#uploader .filelist li p.title {
position: absolute;
top: 0;
left: 0;
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow : ellipsis;
top: 5px;
text-indent: 5px;
text-align: left;
}
#uploader .filelist li p.progress {
position: absolute;
width: 100%;
bottom: 0;
left: 0;
height: 8px;
overflow: hidden;
z-index: 50;
}
#uploader .filelist li p.progress span {
display: none;
overflow: hidden;
width: 0;
height: 100%;
background: #1483d8 url(progress.png) repeat-x;
-webit-transition: width 200ms linear;
-moz-transition: width 200ms linear;
-o-transition: width 200ms linear;
-ms-transition: width 200ms linear;
transition: width 200ms linear;
-webkit-animation: progressmove 2s linear infinite;
-moz-animation: progressmove 2s linear infinite;
-o-animation: progressmove 2s linear infinite;
-ms-animation: progressmove 2s linear infinite;
animation: progressmove 2s linear infinite;
-webkit-transform: translateZ(0);
}
@-webkit-keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
@-moz-keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
@keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
#uploader .filelist li p.imgWrap {
position: relative;
z-index: 2;
line-height: 110px;
vertical-align: middle;
overflow: hidden;
width: 110px;
height: 110px;
-webkit-transform-origin: 50% 50%;
-moz-transform-origin: 50% 50%;
-o-transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webit-transition: 200ms ease-out;
-moz-transition: 200ms ease-out;
-o-transition: 200ms ease-out;
-ms-transition: 200ms ease-out;
transition: 200ms ease-out;
}
#uploader .filelist li img {
width: 100%;
}
#uploader .filelist li p.error {
background: #f43838;
color: #fff;
position: absolute;
bottom: 0;
left: 0;
height: 28px;
line-height: 28px;
width: 100%;
z-index: 100;
}
#uploader .filelist li .success {
display: block;
position: absolute;
left: 0;
bottom: 0;
height: 40px;
width: 100%;
z-index: 200;
text-indent:-9999px;
background: url(success.png) no-repeat right bottom;
}
#uploader .filelist div.file-panel {
position: absolute;
height: 0;
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#80000000', endColorstr='#80000000')\0;
background: rgba( 0, 0, 0, 0.5 );
width: 100%;
top: 0;
left: 0;
overflow: hidden;
z-index: 300;
}
#uploader .filelist div.file-panel span {
width: 24px;
height: 24px;
display: inline;
float: right;
text-indent: -9999px;
overflow: hidden;
background: url(icons.png) no-repeat;
margin: 5px 1px 1px;
cursor: pointer;
}
#uploader .filelist div.file-panel span.rotateLeft {
background-position: 0 -24px;
}
#uploader .filelist div.file-panel span.rotateLeft:hover {
background-position: 0 0;
}
#uploader .filelist div.file-panel span.rotateRight {
background-position: -24px -24px;
}
#uploader .filelist div.file-panel span.rotateRight:hover {
background-position: -24px 0;
}
#uploader .filelist div.file-panel span.cancel {
background-position: -48px -24px;
}
#uploader .filelist div.file-panel span.cancel:hover {
background-position: -48px 0;
}
#uploader .statusBar {
height: 63px;
border-top: 1px solid #dadada;
padding: 0 20px;
line-height: 63px;
vertical-align: middle;
position: relative;
}
#uploader .statusBar .progress {
border: 1px solid #1483d8;
width: 198px;
background: #fff;
height: 18px;
position: relative;
display: inline-block;
text-align: center;
line-height: 20px;
color: #6dbfff;
position: relative;
margin-right: 10px;
}
#uploader .statusBar .progress span.percentage {
width: 0;
height: 100%;
left: 0;
top: 0;
background: #1483d8;
position: absolute;
}
#uploader .statusBar .progress span.text {
position: relative;
z-index: 10;
}
#uploader .statusBar .info {
display: inline-block;
font-size: 14px;
color: #666666;
}
#uploader .statusBar .btns {
position: absolute;
top: 10px;
right: 20px;
line-height: 40px;
}
#filePicker2 {
display: inline-block;
float: left;
}
#uploader .statusBar .btns .webuploader-pick,
#uploader .statusBar .btns .uploadBtn,
#uploader .statusBar .btns .uploadBtn.state-uploading,
#uploader .statusBar .btns .uploadBtn.state-paused {
background: #ffffff;
border: 1px solid #cfcfcf;
color: #565656;
padding: 0 18px;
display: inline-block;
border-radius: 3px;
margin-left: 10px;
cursor: pointer;
font-size: 14px;
float: left;
}
#uploader .statusBar .btns .webuploader-pick-hover,
#uploader .statusBar .btns .uploadBtn:hover,
#uploader .statusBar .btns .uploadBtn.state-uploading:hover,
#uploader .statusBar .btns .uploadBtn.state-paused:hover {
background: #f0f0f0;
}
#uploader .statusBar .btns .uploadBtn {
background: #00b7ee;
color: #fff;
border-color: transparent;
}
#uploader .statusBar .btns .uploadBtn:hover {
background: #00a2d4;
}
#uploader .statusBar .btns .uploadBtn.disabled {
pointer-events: none;
opacity: 0.6;
}
/*--------------华丽分割线--------------------*/
#wrapperx {
width: 100%;
margin: 0 auto;
margin: 1em;
width: auto;
}
#containerx {
border: 1px solid #dadada;
color: #838383;
font-size: 12px;
margin-top: 10px;
background-color: #FFF;
}
#uploaderx .queueList {
margin: 20px;
}
.element-invisible {
position: absolute !important;
clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
clip: rect(1px,1px,1px,1px);
}
#uploaderx .placeholder {
border: 3px dashed #e6e6e6;
min-height: 238px;
padding-top: 158px;
text-align: center;
background: url(image.png) center 93px no-repeat;
color: #cccccc;
font-size: 18px;
position: relative;
}
#uploaderx .placeholder .webuploader-pick {
font-size: 18px;
background: #00b7ee;
border-radius: 3px;
line-height: 44px;
padding: 0 30px;
color: #fff;
display: inline-block;
margin: 20px auto;
cursor: pointer;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}
#uploaderx .placeholder .webuploader-pick-hover {
background: #00a2d4;
}
#uploaderx .placeholder .flashTip {
color: #666666;
font-size: 12px;
position: absolute;
width: 100%;
text-align: center;
bottom: 20px;
}
#uploaderx .placeholder .flashTip a {
color: #0785d1;
text-decoration: none;
}
#uploaderx .placeholder .flashTip a:hover {
text-decoration: underline;
}
#uploaderx .placeholder.webuploader-dnd-over {
border-color: #999999;
}
#uploaderx .placeholder.webuploader-dnd-over.webuploader-dnd-denied {
border-color: red;
}
#uploaderx .filelist {
list-style: none;
margin: 0;
padding: 0;
}
#uploaderx .filelist:after {
content: '';
display: block;
width: 0;
height: 0;
overflow: hidden;
clear: both;
}
#uploaderx .filelist li {
width: 110px;
height: 110px;
background: url(bg.png) no-repeat;
text-align: center;
margin: 0 8px 20px 0;
position: relative;
display: inline;
float: left;
overflow: hidden;
font-size: 12px;
}
#uploaderx .filelist li p.log {
position: relative;
top: -45px;
}
#uploaderx .filelist li p.title {
position: absolute;
top: 0;
left: 0;
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow : ellipsis;
top: 5px;
text-indent: 5px;
text-align: left;
}
#uploaderx .filelist li p.progress {
position: absolute;
width: 100%;
bottom: 0;
left: 0;
height: 8px;
overflow: hidden;
z-index: 50;
}
#uploaderx .filelist li p.progress span {
display: none;
overflow: hidden;
width: 0;
height: 100%;
background: #1483d8 url(progress.png) repeat-x;
-webit-transition: width 200ms linear;
-moz-transition: width 200ms linear;
-o-transition: width 200ms linear;
-ms-transition: width 200ms linear;
transition: width 200ms linear;
-webkit-animation: progressmove 2s linear infinite;
-moz-animation: progressmove 2s linear infinite;
-o-animation: progressmove 2s linear infinite;
-ms-animation: progressmove 2s linear infinite;
animation: progressmove 2s linear infinite;
-webkit-transform: translateZ(0);
}
@-webkit-keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
@-moz-keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
@keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
#uploaderx .filelist li p.imgWrap {
position: relative;
z-index: 2;
line-height: 110px;
vertical-align: middle;
overflow: hidden;
width: 110px;
height: 110px;
-webkit-transform-origin: 50% 50%;
-moz-transform-origin: 50% 50%;
-o-transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webit-transition: 200ms ease-out;
-moz-transition: 200ms ease-out;
-o-transition: 200ms ease-out;
-ms-transition: 200ms ease-out;
transition: 200ms ease-out;
}
#uploaderx .filelist li img {
width: 100%;
}
#uploaderx .filelist li p.error {
background: #f43838;
color: #fff;
position: absolute;
bottom: 0;
left: 0;
height: 28px;
line-height: 28px;
width: 100%;
z-index: 100;
}
#uploaderx .filelist li .success {
display: block;
position: absolute;
left: 0;
bottom: 0;
height: 40px;
width: 100%;
z-index: 200;
text-indent:-9999px;
background: url(success.png) no-repeat right bottom;
}
#uploaderx .filelist div.file-panel {
position: absolute;
height: 0;
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#80000000', endColorstr='#80000000')\0;
background: rgba( 0, 0, 0, 0.5 );
width: 100%;
top: 0;
left: 0;
overflow: hidden;
z-index: 300;
}
#uploaderx .filelist div.file-panel span {
width: 24px;
height: 24px;
display: inline;
float: right;
text-indent: -9999px;
overflow: hidden;
background: url(icons.png) no-repeat;
margin: 5px 1px 1px;
cursor: pointer;
}
#uploaderx .filelist div.file-panel span.rotateLeft {
background-position: 0 -24px;
}
#uploaderx .filelist div.file-panel span.rotateLeft:hover {
background-position: 0 0;
}
#uploaderx .filelist div.file-panel span.rotateRight {
background-position: -24px -24px;
}
#uploaderx .filelist div.file-panel span.rotateRight:hover {
background-position: -24px 0;
}
#uploaderx .filelist div.file-panel span.cancel {
background-position: -48px -24px;
}
#uploaderx .filelist div.file-panel span.cancel:hover {
background-position: -48px 0;
}
#uploaderx .statusBar {
height: 63px;
border-top: 1px solid #dadada;
padding: 0 20px;
line-height: 63px;
vertical-align: middle;
position: relative;
}
#uploaderx .statusBar .progress {
border: 1px solid #1483d8;
width: 198px;
background: #fff;
height: 18px;
position: relative;
display: inline-block;
text-align: center;
line-height: 20px;
color: #6dbfff;
position: relative;
margin-right: 10px;
}
#uploaderx .statusBar .progress span.percentage {
width: 0;
height: 100%;
left: 0;
top: 0;
background: #1483d8;
position: absolute;
}
#uploaderx .statusBar .progress span.text {
position: relative;
z-index: 10;
}
#uploaderx .statusBar .info {
display: inline-block;
font-size: 14px;
color: #666666;
}
#uploaderx .statusBar .btns {
position: absolute;
top: 10px;
right: 20px;
line-height: 40px;
}
#filePicker2x {
display: inline-block;
float: left;
}
#uploaderx .statusBar .btns .webuploader-pick,
#uploaderx .statusBar .btns .uploadBtn,
#uploaderx .statusBar .btns .uploadBtn.state-uploading,
#uploaderx .statusBar .btns .uploadBtn.state-paused {
background: #ffffff;
border: 1px solid #cfcfcf;
color: #565656;
padding: 0 18px;
display: inline-block;
border-radius: 3px;
margin-left: 10px;
cursor: pointer;
font-size: 14px;
float: left;
}
#uploaderx .statusBar .btns .webuploader-pick-hover,
#uploaderx .statusBar .btns .uploadBtn:hover,
#uploaderx .statusBar .btns .uploadBtn.state-uploading:hover,
#uploaderx .statusBar .btns .uploadBtn.state-paused:hover {
background: #f0f0f0;
}
#uploaderx .statusBar .btns .uploadBtn {
background: #00b7ee;
color: #fff;
border-color: transparent;
}
#uploaderx .statusBar .btns .uploadBtn:hover {
background: #00a2d4;
}
#uploaderx .statusBar .btns .uploadBtn.disabled {
pointer-events: none;
opacity: 0.6;
}
```
##需要用到的图片
- 翼通长租公寓管理系统
- 版本升级
- 操作手册
- 添加新店
- 给新店分配管理员(店长)
- 新店必须完成的基础信息
- 常见问题
- 翼通经销商管理系统
- 版本升级
- 聚源达印刷管理系统
- 0、升级说明及重要问题注意
- 1、订单状态说明（兼容老系统）
- 四月显示之僵尸产品
- 打印
- Html5中localStorage存储JSON数据并读取JSON数据的实现方法
- 功能说明
- 2.各种操作说明
- 升级说明
- 物联网
- CentosARM
- 树莓派(RPi) CentOS7扩展内存卡剩余空间
- 翼通管理系统快速开发框架LayUI版
- layui模块使用方法
- 默认显示自定义排序方法
- linq查询输出json小例子
- layui json格式
- treetable借鉴
- layui表单验证
- layui图标
- 第一书记信息管理系统
- 多条件查询搜索
- 年龄计算
- 家庭数据打印
- 数据打印框架
- 后台处理获取需打印数据
- js打印方法
- 图片上传
- 单图上传
- 多图上传
- 多图上传CSS样式
- 图片保存
- 高级大招
- SqlServer
- sqlserver 去重复并查询的一列数据拼接用逗号隔开显示
- 修复SqlServer孤立用户
- VS2017提高开发效率的几大技巧看过终生受用，错过继续盲目忙碌。
- 微信开发
- 微信开发基础
- 1、微信公众平台测试帐号的注册与使用
- 2、NuGet引用Senparc微信开发类
- 3、微信接入应答问文件
- 微信开发进阶
- 1、绑定用户把openid、用户头像、昵称绑定到数据库
- 2、阿里大鱼发送验证短信
- 3、测试用户是否关注公众号
- 人人商城
- 1、公众号接入配置
- 2、公众号支付配置
- 3、手机短信配置
- 4、小程序配置
- 5、店铺可视化装修
- 6、三级分销配置
- MarkDown
- 1、markdown写流程图帮助文档
- 阿里短信
- 常用短信模板
- 中国翼通基类库
- 一、说明
- 二、基类库代码（用法索引）
- 1、阿里大鱼短信
- 2、阿里云短信类
- 3、web.config操作类
- 4、字符操作类
- 5、随机数
- 6、拼音类
- 7、身份证类
- 8、SqlServer数据库操作sqleasy
- 9、JSON类
- 999、日志调试类
- 10、QRCode生成二维码
- 11、保存远程图片到本地
- 12、Session类
- 13、ip类
- 14、验证码
- 15、base64类
- 翼通CMS版本升级
- 昆明市公安局政治部
- 3D打印
- 老挝消费机
- 帮助文档
- 工作流开发
- 工作流数据库结构
- 工作流借鉴
- 思想
- 设计工作流要注意的问题
- 编译错误
- 缺少编译器要求的成员“Microsoft.CSharp.RuntimeBinder.CSharpArgumentInfo.Create"
- EasyUI操作例子
- combogrid绑定
- linq
- 建立linqToSqlServer连接
- 公租房管理系统
- 改进升级更新
- 云南民间工艺传承协会
- 思路
- 问题
- 云南麦根科技有限公司
- 月嫂多APP
- 嫂多点APP
- 管理后台
- Laravel
- 一、开发环境搭建
- 二、如何正确使用 Composer 安装 Laravel 扩展包
- 三、修改数据库连接
- 四、创建一个简单的Laravel例子
- 五. laravel维护日记
- 六、nginx下伪静态配置
- 七、增删查改知识点
- 腾讯借贷反欺诈开发
- ThinkPHP
- 0、ThinkPHP安装
- 2、Zend Studio 13.6.1 的安装和破解
- 1、thinkphp自由查询语句分页
- 3、thinkphp M R 方法详解
- 4、前台循环
- 5、laiui提交表单
- 翼通云官方网站(里面有内容)
- 开发过程中各种问题
- 小鸟云系统的坑
- 更新日志
- 单页面模板
- 翼通智慧网站策划
- 4.05到4.10升级
- phpstom
- 一、设置字体、外观
- 二、phpstom运行php教程
- 三、phpstom debug调试
- 四、PHPStorm 提示502 Bad Gateway
- vscode
- vscode常用插件
- vscode使用git翼通教程
- Git忽略提交规则 - .gitignore配置运维总结
- Git忽略文件不起作用解决方案
- vscode添加新建文件头部注释和函数注释
- git命令
- git命令大全
- vscode每次打开都会覆盖窗口
- git忽略文件格式
- ios au 更新APP store教程
- iOS APP版本更新升级教程
- 上传ipa常见错误解决方案
- 上传ipa报错版本号重复问题解决教程
- hbuider
- Hbuider制作app升级包的简单办法 (升级官方提供的案例)
- linux
- wdcp后台访问安全设置即限制域名/IP访问设置及清除方法
- MSSQL数据库
- 恢复
- SqlServer将没有log文件的数据库文件附加到服务器中
- 1、mssql2019报18456不能登录
- [简易版]幼儿园新生入学报名管理系统
- 物流园电子出门条系统
- 电脑自选超市开发
- 服务商操作手册
- 管理员操作手册
- EcShop
- 一、EcShop5.3升级5.6遇到问题
- 2、ECShop 时间相差8小时、时间不对的问题
- 3、数据库操作
- 3、嵌入类的方法
- 4、入驻商列表sql