@font-face { font-family: "Montserrat"; src: url("../fonts/Montserrat-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: "Montserrat-Bold"; src: url("../fonts/Montserrat-Bold.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: "Montserrat-Medium"; src: url("../fonts/Montserrat-Medium.ttf") format("truetype"); font-weight: normal; font-style: normal; } ::-webkit-scrollbar { width: 0.625rem; background: #d2eafb; } ::-webkit-scrollbar-track { border-radius: 0.5rem; background: #eeeeee; } * { margin: 0; padding: 0; font-family: 'Montserrat'; } *:hover { transition: all 0.2s linear; -webkit-transition: all 0.2s linear; } body { font-size: 1.2em; font-weight: 400; color: #333; --max-width: 1920px; max-width: var(--max-width); margin: 0 auto; } select, input, textarea, button { outline: none; font-size: 0.875rem; border-radius: 0; -webkit-border-radius: 0; color: #414446; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; } a { color: #333; cursor: pointer; text-decoration: none; transition: all 0.2s linear; -webkit-transition: all 0.2s linear; text-decoration: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /* img { display: block; } */ ul li { padding: 2px 0; list-style-type: none; } ol, ul, a { list-style: none; } /* 修改垂直滚动条 */ ::-webkit-scrollbar { width: 6px; /* 修改宽度 */ } /* 修改滚动条轨道背景色 */ ::-webkit-scrollbar-track { background-color: transparent; } /* 修改滚动条滑块颜色 */ ::-webkit-scrollbar-thumb { background-color: #ccc; } /* 修改滚动条滑块悬停时的颜色 */ ::-webkit-scrollbar-thumb:hover { background-color: #D8DFE8; } /* 修改滚动条滑块移动时的颜色 */ ::-webkit-scrollbar-thumb:active { background-color: #D8DFE8; } /* 修改滚动条滑块的圆角 */ ::-webkit-scrollbar-thumb { border-radius: 5px; } /* 整体滚动条 */ * { scrollbar-width: thin; /* 滚动条宽度 */ scrollbar-color: #D8DBE6 transparent; /* 滚动条颜色(滑块颜色 轨道颜色) */ } /* 滚动条轨道 */ *::-moz-scrollbar-track { background-color: #f0f0f0; } /* 滚动条滑块 */ *::-moz-scrollbar-thumb { background-color: #D8DBE6; border-radius: 5px; /* 滑块的圆角 */ } /* 滚动条的上下箭头 */ *::-moz-scrollbar-button { display: none; /* 隐藏上下箭头 */ } /* 滚动条的上下箭头:向上箭头 */ *::-moz-scrollbar-button:vertical:decrement { display: none; } /* 滚动条的上下箭头:向下箭头 */ *::-moz-scrollbar-button:vertical:increment { display: none; } div{ display: block; } #header{ height: 60px; } .backtop { position: fixed; right: 1.25rem; padding: 10px 5px; bottom: 10%; display: flex; justify-content: center; align-items: center; flex-direction: column; color: #666; font-size: 0.75rem; background: #fff; cursor: pointer; border: 1px solid rgb(241, 241, 241); } .backtop .ictop { height: 1.125rem; width: 0.9375rem; margin-bottom: 0.25rem; } /*屏幕兼容性*/ @media screen and (min-width:150px) and (max-width:749px){ body{ zoom: 0.6; } } @media screen and (min-width:750px) and (max-width:1280px){ body{ zoom: 0.75; } } @media screen and (min-width:1281px) and (max-width:1360px) { body{ zoom: 0.8; } } @media screen and (min-width:1361px) and (max-width:1460px) { body{ zoom: 0.85; } } @media screen and (min-width:1461px) and (max-width:1660px) { body{ zoom: 0.9; } } @media screen and (min-width:1661px) and (max-width:1760px) { body{ zoom: 0.95; } } @media screen and (min-width:1761px) and (max-width:1960px) {} @media screen and (min-width:1980px) {} /*编辑器样式*/ @charset "UTF-8";.ql-container { box-sizing: border-box; font-family: Helvetica,Arial,sans-serif; font-size: 13px; height: 100%; margin: 0; position: relative } .ql-container.ql-disabled .ql-tooltip { visibility: hidden } .ql-editor video{ max-width: 100% !important; } .ql-container.ql-disabled .ql-editor ul[data-checked]>li:before { pointer-events: none } .ql-clipboard { left: -100000px; height: 1px; overflow-y: hidden; position: absolute; top: 50% } .ql-clipboard p { margin: 0; padding: 0 } .ql-editor { box-sizing: border-box; line-height: 1.42; height: 100%; outline: none; overflow-y: auto; padding: 12px 15px; tab-size: 4; -moz-tab-size: 4; text-align: left; white-space: pre-wrap; word-wrap: break-word } .ql-editor>* { cursor: text } .ql-editor p,.ql-editor ol,.ql-editor ul,.ql-editor pre,.ql-editor blockquote,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6 { margin: 0; padding: 0; counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9 } .ql-editor ol,.ql-editor ul { padding-left: 1.5em } .ql-editor ol>li,.ql-editor ul>li { list-style-type: none } .ql-editor ul>li:before { content: "•" } .ql-editor ul[data-checked=true],.ql-editor ul[data-checked=false] { pointer-events: none } .ql-editor ul[data-checked=true]>li *,.ql-editor ul[data-checked=false]>li * { pointer-events: all } .ql-editor ul[data-checked=true]>li:before,.ql-editor ul[data-checked=false]>li:before { color: #777; cursor: pointer; pointer-events: all } .ql-editor ul[data-checked=true]>li:before { content: "☑" } .ql-editor ul[data-checked=false]>li:before { content: "☐" } .ql-editor li:before { display: inline-block; white-space: nowrap; width: 1.2em } .ql-editor li:not(.ql-direction-rtl):before { margin-left: -1.5em; margin-right: .3em; text-align: right } .ql-editor li.ql-direction-rtl:before { margin-left: .3em; margin-right: -1.5em } .ql-editor ol li:not(.ql-direction-rtl),.ql-editor ul li:not(.ql-direction-rtl) { padding-left: 1.5em } .ql-editor ol li.ql-direction-rtl,.ql-editor ul li.ql-direction-rtl { padding-right: 1.5em } .ql-editor ol li { counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9; counter-increment: list-0 } .ql-editor ol li:before { content: counter(list-0,decimal) ". " } .ql-editor ol li.ql-indent-1 { counter-increment: list-1 } .ql-editor ol li.ql-indent-1:before { content: counter(list-1,lower-alpha) ". " } .ql-editor ol li.ql-indent-1 { counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9 } .ql-editor ol li.ql-indent-2 { counter-increment: list-2 } .ql-editor ol li.ql-indent-2:before { content: counter(list-2,lower-roman) ". " } .ql-editor ol li.ql-indent-2 { counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9 } .ql-editor ol li.ql-indent-3 { counter-increment: list-3 } .ql-editor ol li.ql-indent-3:before { content: counter(list-3,decimal) ". " } .ql-editor ol li.ql-indent-3 { counter-reset: list-4 list-5 list-6 list-7 list-8 list-9 } .ql-editor ol li.ql-indent-4 { counter-increment: list-4 } .ql-editor ol li.ql-indent-4:before { content: counter(list-4,lower-alpha) ". " } .ql-editor ol li.ql-indent-4 { counter-reset: list-5 list-6 list-7 list-8 list-9 } .ql-editor ol li.ql-indent-5 { counter-increment: list-5 } .ql-editor ol li.ql-indent-5:before { content: counter(list-5,lower-roman) ". " } .ql-editor ol li.ql-indent-5 { counter-reset: list-6 list-7 list-8 list-9 } .ql-editor ol li.ql-indent-6 { counter-increment: list-6 } .ql-editor ol li.ql-indent-6:before { content: counter(list-6,decimal) ". " } .ql-editor ol li.ql-indent-6 { counter-reset: list-7 list-8 list-9 } .ql-editor ol li.ql-indent-7 { counter-increment: list-7 } .ql-editor ol li.ql-indent-7:before { content: counter(list-7,lower-alpha) ". " } .ql-editor ol li.ql-indent-7 { counter-reset: list-8 list-9 } .ql-editor ol li.ql-indent-8 { counter-increment: list-8 } .ql-editor ol li.ql-indent-8:before { content: counter(list-8,lower-roman) ". " } .ql-editor ol li.ql-indent-8 { counter-reset: list-9 } .ql-editor ol li.ql-indent-9 { counter-increment: list-9 } .ql-editor ol li.ql-indent-9:before { content: counter(list-9,decimal) ". " } .ql-editor .ql-indent-1:not(.ql-direction-rtl) { padding-left: 3em } .ql-editor li.ql-indent-1:not(.ql-direction-rtl) { padding-left: 4.5em } .ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right { padding-right: 3em } .ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right { padding-right: 4.5em } .ql-editor .ql-indent-2:not(.ql-direction-rtl) { padding-left: 6em } .ql-editor li.ql-indent-2:not(.ql-direction-rtl) { padding-left: 7.5em } .ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right { padding-right: 6em } .ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right { padding-right: 7.5em } .ql-editor .ql-indent-3:not(.ql-direction-rtl) { padding-left: 9em } .ql-editor li.ql-indent-3:not(.ql-direction-rtl) { padding-left: 10.5em } .ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right { padding-right: 9em } .ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right { padding-right: 10.5em } .ql-editor .ql-indent-4:not(.ql-direction-rtl) { padding-left: 12em } .ql-editor li.ql-indent-4:not(.ql-direction-rtl) { padding-left: 13.5em } .ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right { padding-right: 12em } .ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right { padding-right: 13.5em } .ql-editor .ql-indent-5:not(.ql-direction-rtl) { padding-left: 15em } .ql-editor li.ql-indent-5:not(.ql-direction-rtl) { padding-left: 16.5em } .ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right { padding-right: 15em } .ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right { padding-right: 16.5em } .ql-editor .ql-indent-6:not(.ql-direction-rtl) { padding-left: 18em } .ql-editor li.ql-indent-6:not(.ql-direction-rtl) { padding-left: 19.5em } .ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right { padding-right: 18em } .ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right { padding-right: 19.5em } .ql-editor .ql-indent-7:not(.ql-direction-rtl) { padding-left: 21em } .ql-editor li.ql-indent-7:not(.ql-direction-rtl) { padding-left: 22.5em } .ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right { padding-right: 21em } .ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right { padding-right: 22.5em } .ql-editor .ql-indent-8:not(.ql-direction-rtl) { padding-left: 24em } .ql-editor li.ql-indent-8:not(.ql-direction-rtl) { padding-left: 25.5em } .ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right { padding-right: 24em } .ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right { padding-right: 25.5em } .ql-editor .ql-indent-9:not(.ql-direction-rtl) { padding-left: 27em } .ql-editor li.ql-indent-9:not(.ql-direction-rtl) { padding-left: 28.5em } .ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right { padding-right: 27em } .ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right { padding-right: 28.5em } .ql-editor .ql-video { display: block; max-width: 100% } .ql-editor .ql-video.ql-align-center { margin: 0 auto } .ql-editor .ql-video.ql-align-right { margin: 0 0 0 auto } .ql-editor .ql-bg-black { background-color: #000 } .ql-editor .ql-bg-red { background-color: #e60000 } .ql-editor .ql-bg-orange { background-color: #f90 } .ql-editor .ql-bg-yellow { background-color: #ff0 } .ql-editor .ql-bg-green { background-color: #008a00 } .ql-editor .ql-bg-blue { background-color: #06c } .ql-editor .ql-bg-purple { background-color: #93f } .ql-editor .ql-color-white { color: #fff } .ql-editor .ql-color-red { color: #e60000 } .ql-editor .ql-color-orange { color: #f90 } .ql-editor .ql-color-yellow { color: #ff0 } .ql-editor .ql-color-green { color: #008a00 } .ql-editor .ql-color-blue { color: #06c } .ql-editor .ql-color-purple { color: #93f } .ql-editor .ql-font-serif { font-family: Georgia,Times New Roman,serif } .ql-editor .ql-font-monospace { font-family: Monaco,Courier New,monospace } .ql-editor .ql-size-small { font-size: .75em } .ql-editor .ql-size-large { font-size: 1.5em } .ql-editor .ql-size-huge { font-size: 2.5em } .ql-editor .ql-direction-rtl { direction: rtl; text-align: inherit } .ql-editor .ql-align-center { text-align: center } .ql-editor .ql-align-justify { text-align: justify } .ql-editor .ql-align-right { text-align: right } .ql-editor.ql-blank:before { color: #0009; content: attr(data-placeholder); font-style: italic; left: 15px; pointer-events: none; position: absolute; right: 15px } .ql-snow.ql-toolbar:after,.ql-snow .ql-toolbar:after { clear: both; content: ""; display: table } .ql-snow.ql-toolbar button,.ql-snow .ql-toolbar button { background: none; border: none; cursor: pointer; display: inline-block; float: left; height: 24px; padding: 3px 5px; width: 28px; margin-left: 1px; margin-right: 1px } .ql-snow.ql-toolbar button svg,.ql-snow .ql-toolbar button svg { float: left; height: 100% } .ql-snow.ql-toolbar button:active:hover,.ql-snow .ql-toolbar button:active:hover { outline: none } .ql-snow.ql-toolbar input.ql-image[type=file],.ql-snow .ql-toolbar input.ql-image[type=file] { display: none } .ql-snow.ql-toolbar button:hover,.ql-snow .ql-toolbar button:hover,.ql-snow.ql-toolbar button:focus,.ql-snow .ql-toolbar button:focus,.ql-snow.ql-toolbar .ql-picker-label:hover,.ql-snow .ql-toolbar .ql-picker-label:hover,.ql-snow.ql-toolbar .ql-picker-item:hover,.ql-snow .ql-toolbar .ql-picker-item:hover { background-color: #f3f4f6 } .ql-snow.ql-toolbar button.ql-active,.ql-snow .ql-toolbar button.ql-active,.ql-snow.ql-toolbar .ql-picker-label.ql-active,.ql-snow .ql-toolbar .ql-picker-label.ql-active,.ql-snow.ql-toolbar .ql-picker-item.ql-selected,.ql-snow .ql-toolbar .ql-picker-item.ql-selected { background-color: #dbeafe; color: #2563eb } .ql-snow.ql-toolbar button.ql-active .ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill { fill: #2563eb } .ql-snow.ql-toolbar button.ql-active .ql-stroke,.ql-snow .ql-toolbar button.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter { stroke: #2563eb } @media (pointer: coarse) { .ql-snow.ql-toolbar button:hover:not(.ql-active),.ql-snow .ql-toolbar button:hover:not(.ql-active) { color:#4b5563 } .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill { fill: #4b5563 } .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter { stroke: #4b5563 } } .ql-snow,.ql-snow * { box-sizing: border-box } .ql-snow .ql-hidden { display: none } .ql-snow .ql-out-bottom,.ql-snow .ql-out-top { visibility: hidden } .ql-snow .ql-tooltip { position: absolute; transform: translateY(10px) } .ql-snow .ql-tooltip a { cursor: pointer; text-decoration: none } .ql-snow .ql-tooltip.ql-flip { transform: translateY(-10px) } .ql-snow .ql-formats { display: inline-block; vertical-align: middle } .ql-snow .ql-formats:after { clear: both; content: ""; display: table } .ql-snow .ql-stroke { fill: none; stroke: #4b5563; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2 } .ql-snow .ql-stroke-miter { fill: none; stroke: #4b5563; stroke-miterlimit: 10; stroke-width: 2 } .ql-snow .ql-fill,.ql-snow .ql-stroke.ql-fill { fill: #4b5563 } .ql-snow .ql-empty { fill: none } .ql-snow .ql-even { fill-rule: evenodd } .ql-snow .ql-thin,.ql-snow .ql-stroke.ql-thin { stroke-width: 1 } .ql-snow .ql-transparent { opacity: .4 } .ql-snow .ql-direction svg:last-child { display: none } .ql-snow .ql-direction.ql-active svg:last-child { display: inline } .ql-snow .ql-direction.ql-active svg:first-child { display: none } .ql-snow .ql-editor h1 { font-size: 2em } .ql-snow .ql-editor h2 { font-size: 1.5em } .ql-snow .ql-editor h3 { font-size: 1.17em } .ql-snow .ql-editor h4 { font-size: 1em } .ql-snow .ql-editor h5 { font-size: .83em } .ql-snow .ql-editor h6 { font-size: .67em } .ql-snow .ql-editor a { text-decoration: underline } .ql-snow .ql-editor blockquote { border-left: 4px solid #ccc; margin-bottom: 5px; margin-top: 5px; padding-left: 16px } .ql-snow .ql-editor code,.ql-snow .ql-editor pre { background-color: #f0f0f0; border-radius: 3px } .ql-snow .ql-editor pre { white-space: pre-wrap; margin-bottom: 5px; margin-top: 5px; padding: 5px 10px } .ql-snow .ql-editor code { font-size: 85%; padding: 2px 4px } .ql-snow .ql-editor pre.ql-syntax { background-color: #23241f; color: #f8f8f2; overflow: visible } .ql-snow .ql-editor img { max-width: 100% } .ql-snow .ql-picker { color: #4b5563; display: inline-block; float: left; font-size: 14px; font-weight: 500; height: 24px; position: relative; vertical-align: middle; margin-right: 1px; margin-left: 1px } .ql-snow .ql-picker-label { cursor: pointer; display: flex; height: 100%; padding-left: 8px; padding-right: 2px; position: relative; width: 100% } .ql-snow .ql-picker-label:before { display: inline-block; line-height: 22px } .ql-snow .ql-picker-options { background-color: #fff; display: none; min-width: 100%; position: absolute; white-space: nowrap } .ql-snow .ql-picker-options .ql-picker-item { cursor: pointer; display: block; padding: 5px 8px } .ql-snow .ql-picker.ql-expanded .ql-picker-label { color: #d1d5db; z-index: 2 } .ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill { fill: #d1d5db } .ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke { stroke: #d1d5db } .ql-snow .ql-picker.ql-expanded .ql-picker-options { display: block; margin-top: -1px; top: 100%; z-index: 1 } .ql-snow .ql-color-picker,.ql-snow .ql-icon-picker { width: 28px } .ql-snow .ql-color-picker .ql-picker-label,.ql-snow .ql-icon-picker .ql-picker-label { padding: 2px 4px } .ql-snow .ql-color-picker .ql-picker-label svg,.ql-snow .ql-icon-picker .ql-picker-label svg { right: 4px } .ql-snow .ql-icon-picker .ql-picker-options { padding: 3px } .ql-snow .ql-icon-picker .ql-picker-item { height: 24px; width: 24px; padding: 2px 4px; margin: 2px } .ql-snow .ql-color-picker .ql-picker-options { padding: 3px 5px; width: 152px } .ql-snow .ql-color-picker .ql-picker-item { border: 1px solid transparent; float: left; height: 16px; margin: 2px; padding: 0; width: 16px } .ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg { position: absolute; margin-top: -9px; right: 0; top: 50%; width: 18px } .ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=""]):before { content: attr(data-label) } .ql-snow .ql-picker.ql-header { width: 98px } .ql-snow .ql-picker.ql-header .ql-picker-label:before,.ql-snow .ql-picker.ql-header .ql-picker-item:before { content: "Normal" } .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before { content: "Heading 1" } .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before { content: "Heading 2" } .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before { content: "Heading 3" } .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before { content: "Heading 4" } .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before { content: "Heading 5" } .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before { content: "Heading 6" } .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before { font-size: 2em } .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before { font-size: 1.5em } .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before { font-size: 1.17em } .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before { font-size: 1em } .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before { font-size: .83em } .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before { font-size: .67em } .ql-snow .ql-picker.ql-font { width: 108px } .ql-snow .ql-picker.ql-font .ql-picker-label:before,.ql-snow .ql-picker.ql-font .ql-picker-item:before { content: "Sans Serif" } .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before { content: "Serif" } .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before { content: "Monospace" } .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before { font-family: Georgia,Times New Roman,serif } .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before { font-family: Monaco,Courier New,monospace } .ql-snow .ql-picker.ql-size { width: 98px } .ql-snow .ql-picker.ql-size .ql-picker-label:before,.ql-snow .ql-picker.ql-size .ql-picker-item:before { content: "Normal" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before { content: "Small" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before { content: "Large" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before { content: "Huge" } .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before { font-size: 10px } .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before { font-size: 18px } .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before { font-size: 32px } .ql-snow .ql-color-picker.ql-background .ql-picker-item { background-color: #fff } .ql-snow .ql-color-picker.ql-color .ql-picker-item { background-color: #000 } .ql-toolbar.ql-snow { border: 1px solid #d1d5db; box-sizing: border-box; font-family: Helvetica Neue,Helvetica,Arial,sans-serif; padding: 8px } .ql-toolbar.ql-snow .ql-formats { margin-right: 15px } .ql-toolbar.ql-snow .ql-picker-label { border: 1px solid transparent } .ql-toolbar.ql-snow .ql-picker-options { border: 1px solid transparent; box-shadow: #0003 0 2px 8px } .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label,.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options { border-color: #d1d5db } .ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover { border-color: #000 } .ql-toolbar.ql-snow+.ql-container.ql-snow { border-top: 0px } .ql-snow .ql-tooltip { background-color: #fff; border: 1px solid #d1d5db; box-shadow: 0 0 5px #d1d5db; color: #4b5563; padding: 5px 12px; white-space: nowrap } .ql-snow .ql-tooltip:before { content: "Visit URL:"; line-height: 26px; margin-right: 8px } .ql-snow .ql-tooltip input[type=text] { display: none; border: 1px solid #d1d5db; font-size: 13px; height: 26px; margin: 0; padding: 3px 5px; width: 170px } .ql-snow .ql-tooltip a.ql-preview { display: inline-block; max-width: 200px; overflow-x: hidden; text-overflow: ellipsis; vertical-align: top } .ql-snow .ql-tooltip a.ql-action:after { border-right: 1px solid #d1d5db; content: "Edit"; margin-left: 16px; padding-right: 8px } .ql-snow .ql-tooltip a.ql-remove:before { content: "Remove"; margin-left: 8px } .ql-snow .ql-tooltip a { line-height: 26px } .ql-snow .ql-tooltip.ql-editing a.ql-preview,.ql-snow .ql-tooltip.ql-editing a.ql-remove { display: none } .ql-snow .ql-tooltip.ql-editing input[type=text] { display: inline-block } .ql-snow .ql-tooltip.ql-editing a.ql-action:after { border-right: 0px; content: "Save"; padding-right: 0 } .ql-snow .ql-tooltip[data-mode=link]:before { content: "Enter link:" } .ql-snow .ql-tooltip[data-mode=formula]:before { content: "Enter formula:" } .ql-snow .ql-tooltip[data-mode=video]:before { content: "Enter video:" } .ql-snow a { color: #2563eb } .ql-container.ql-snow { border: 1px solid #d1d5db } .editor,.ql-toolbar { line-height: normal!important; white-space: pre-wrap!important } .editor-img-uploader { display: none } .ql-editor { /* min-height: 600px; max-height: 600px; */ overflow: auto } .ql-snow .ql-tooltip[data-mode=link]:before { content: "请输入链接地址:" } .ql-snow .ql-tooltip.ql-editing a.ql-action:after { padding-right: 0; content: "保存"; border-right: 0 } .ql-snow .ql-tooltip[data-mode=video]:before { content: "请输入视频地址:" } .ql-snow .ql-picker.ql-size .ql-picker-label:before,.ql-snow .ql-picker.ql-size .ql-picker-item:before { content: "12px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before { content: "10px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before { content: "18px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before { content: "32px" } .ql-snow .ql-picker.ql-header .ql-picker-label:before,.ql-snow .ql-picker.ql-header .ql-picker-item:before { content: "文本" } .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before { content: "标题1" } .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before { content: "标题2" } .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before { content: "标题3" } .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before { content: "标题4" } .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before { content: "标题5" } .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before { content: "标题6" } .ql-snow .ql-picker.ql-font .ql-picker-label:before,.ql-snow .ql-picker.ql-font .ql-picker-item:before { content: "标准字体" } .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before { content: "衬线字体" } .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before { content: "等宽字体" } .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=SimSun]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=SimSun]:before { font-family: SimSun,sans-serif; content: "宋体" } .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=SimHei]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=SimHei]:before { font-family: SimHei,sans-serif; content: "黑体" } .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=Microsoft-YaHei]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=Microsoft-YaHei]:before { font-family: Microsoft YaHei,sans-serif; content: "微软雅黑" } .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=KaiTi]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=KaiTi]:before { font-family: KaiTi,sans-serif; content: "楷体" } .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=FangSong]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=FangSong]:before { font-family: FangSong,sans-serif; content: "仿宋" } .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=Arial]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=Arial]:before { font-family: Arial,sans-serif; content: "Arial" } .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=Times-New-Roman]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=Times-New-Roman]:before { font-family: Times New Roman,sans-serif; content: "Times New Roman" } .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=sans-serif]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=sans-serif]:before { font-family: sans-serif; content: "sans-serif" } .ql-font-SimSun { font-family: SimSun,sans-serif } .ql-font-SimHei { font-family: SimHei,sans-serif } .ql-font-Microsoft-YaHei { font-family: Microsoft YaHei,sans-serif } .ql-font-KaiTi { font-family: KaiTi,sans-serif } .ql-font-FangSong { font-family: FangSong,sans-serif } .ql-font-Arial { font-family: Arial,sans-serif } .ql-font-Times-New-Roman { font-family: Times New Roman,sans-serif } .ql-font-sans-serif { font-family: sans-serif } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="12px"]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="12px"]:before { content: "12px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="14px"]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="14px"]:before { content: "14px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="16px"]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="16px"]:before { content: "16px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="18px"]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="18px"]:before { content: "18px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="20px"]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="20px"]:before { content: "20px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="22px"]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="22px"]:before { content: "22px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="24px"]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="24px"]:before { content: "24px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="26px"]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="26px"]:before { content: "26px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="28px"]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="28px"]:before { content: "28px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="30px"]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="30px"]:before { content: "30px" } .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="32px"]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="32px"]:before { content: "32px" } /*tab切换样式*/ /* 标签页样式 */ .quill-tabs { margin: 15px 0; overflow: hidden; border: 1px solid #dddddd; border-radius: 4px; } /* 用伪元素添加图标(可替换为自己的图标) */ .ql-tabs::before { font-size: 16px; content: "T"; /* 用 emoji 或字体图标 */ } .quill-tab-list { display: flex; background-color: #f8f9fa; border-bottom: 1px solid #dddddd; } .quill-tab-list .quill-tab-button { padding: 10px 15px; font-weight: 500; cursor: pointer; background: transparent; border: none; transition: background-color 0.2s; } .quill-tab-list .quill-tab-button.active { color: #007bff; background-color: white; border-bottom: 2px solid #007bff; } .quill-tab-list .quill-tab-edit-btn { display: flex; align-items: center; padding: 10px; margin-left: auto; color: #606266; cursor: pointer; background: transparent; border: none; } .quill-tab-list .quill-tab-edit-btn:hover { color: #007bff; } .quill-tab-button { padding: 10px 15px; font-weight: 500; cursor: pointer; background: transparent; border: none; transition: background-color 0.2s; } .quill-tab-button.active { color: #007bff; background-color: white; border-bottom: 2px solid #007bff; } .quill-tab-content-list { padding: 15px; } .quill-tab-content { display: none; } .quill-tab-content.active { display: block; } /* 标签页标题编辑样式 */ .tab-title-edit { display: flex; align-items: center; } .tab-title-edit .title-text { display: inline-block; min-width: 60px; padding: 0 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; } .tab-title-edit .title-input { width: 100px; margin: -2px 0; /* 与标签对齐 */ }