/* CSS初始化 */ body, ol, ul, h1, h2, h3, h4, h5, h6, p, th, td, dl, dd, form, fieldset, legend, input, textarea, select { margin: 0; padding: 0; } body { font: 14px, "Monospaced Number", "Chinese Quote", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif, sans-serif, "宋体", "Arial Narrow", HELVETICA; background: #fff; -webkit-text-size-adjust: 100%; } a { color: #172c45; text-decoration: none; } a:hover { color: #cd0200; text-decoration: underline; } em { font-style: normal; } li { list-style: none; } img { border: 0; vertical-align: middle; } table { border-collapse: collapse; border-spacing: 0; } p { word-wrap: break-word; } :focus { outline: none; } /* index.css */ html, body { height: 100%; } body { margin: 0; width: 100%; color: #000; font-size: 14px; } .to__hiden { display: none !important; } .to__item .icon-arrow { margin-right: 10px; width: 12px; height: 12px; background: url('../images/icon-arrow.svg'); display: inline-block; vertical-align: middle; transform: rotate(-90deg); } .to__item .to__roate { transform: rotate(0); } .to__item .to__prefix { margin-right: 10px; width: 16px; height: 16px; display: inline-block; vertical-align: middle; } .to__block { padding-left: 10px; text-align: center; width: 50%; margin-bottom: 100px } .to__block .to__parentName { margin-left: 6px; color: rgb(255, 255, 255); font-size: 12px; display: inline-block; vertical-align: middle; } .to__block .to__left, .to__block .to__right { width: 45%; display: inline-block; vertical-align: text-top; } .to__block .to__left .to__item, .to__block .to__right .to__item { padding-left: 20px; height: 40px; line-height: 40px; border-bottom: 1px solid #eee; } .to__block .to__left .to__title, .to__block .to__right .to__title { line-height: 30px; text-align: left; color: rgb(255, 255, 255); } .to__block .to__left .to__title .to__remark, .to__block .to__right .to__title .to__remark { color: rgb(255, 255, 255); display: inline-block; } .to__block .to__left .to__content, .to__block .to__right .to__content { width: 100%; height: 300px; text-align: left; border: 1px solid #ccc; box-sizing: border-box; overflow-y: auto; } .to__block .to__left .to__content .to__search, .to__block .to__right .to__content .to__search { position: relative; height: 30px; line-height: 30px; border-bottom: 1px solid #ccc; } .to__block .to__left .to__content .to__search input, .to__block .to__right .to__content .to__search input { padding-left: 20px; padding-right: 100px; width: 100%; border: none; box-sizing: border-box; } .to__block .to__left .to__content .to__search .to__icon__search, .to__block .to__right .to__content .to__search .to__icon__search { position: absolute; top: 0; right: 0; width: 50px; height: 30px; border-left: 1px solid #ccc; } .to__block .to__left .to__content .to__search .to__icon__search svg, .to__block .to__right .to__content .to__search .to__icon__search svg { margin: auto; position: absolute; top: 0; bottom: 0; left: 0; right: 0; } .to__block .to__left { position: relative; margin-right: 30px; } .to__block .to__left > div .to__subItem { padding-left: 20px; } .to__block .to__left .to__split { margin: auto 0; position: absolute; right: 0; top: 0; bottom: 0; color: rgb(255, 255, 255); height: 30px; line-height: 30px; font-size: 20px; transform: translateX(120%); } .to__block .to__left .to__split span:last-child { margin-left: -16px; } .to__block .to__left .to__item { position: relative; } .to__block .to__left .to__item .to__name { display: inline-block; vertical-align: middle; cursor: pointer; } .to__name { color: rgb(255, 255, 255); } .to__block .to__left .to__item .to__number { margin-left: 6px; color: rgb(255, 255, 255); font-size: 12px; display: inline-block; vertical-align: middle; } .to__block .to__left .to__item .icon__round { margin: auto 0; position: absolute; top: 0; bottom: 0; right: 10px; margin-right: 6px; width: 16px; height: 16px; background-repeat: no-repeat; background-size: 100%; border-radius: 50%; display: inline-block; vertical-align: middle; cursor: pointer; } .to__block .to__left .to__item .icon__round--false { background-image: url('../images/icon-round-no.svg'); } .to__block .to__left .to__item .icon__round--true { background-image: url('../images/icon-round-yes.svg'); } .to__block .to__right { position: relative; } .to__block .to__right .to__item { position: relative; } .to__block .to__right .to__item .to__close { margin: auto 0; position: absolute; right: 12px; top: 0; bottom: 0; width: 16px; height: 16px; background: url('../images/icon-close.svg') no-repeat; background-size: 100%; display: inline-block; cursor: pointer; }