Discuz! A lot of pre-defined CSS styles are saved in the template/default/common/common.css file. the header file header.htm must be included, and the pre-defined CSS files must be loaded, familiar with these predefined styles is necessary for plug-in development, which saves us a lot of trouble. The following describes some common preferences.
Discuz! A lot of pre-defined CSS styles are saved in the template/default/common/common.css file. the header file header.htm must be included, and the pre-defined CSS files must be loaded, familiar with these predefined styles is necessary for plug-in development, which saves us a lot of trouble.
The following describes some common predefined styles.
1. floating and floating overflow cleaning
/* Floating around */
. Z {float: left ;}
. Y {float: right ;}
/* Floating cleaning */
. Cl: after {content: "."; display: block; height: 0; clear: both; visibility: hidden ;}
. Cl {zoom: 1 ;}
The above floating method is used:
2. text font size
. Xs1 {font-size: 12px! Important ;}
. Xs2 {font-size: 14px! Important ;}
. Xs3 {font-size: 16px! Important ;}
3. gray text
"56">. xg1,. xg1 a {color: {LIGHTTEXT }! Important ;}
. Xg1. xi2 {color: {HIGHLIGHTLINK }! Important ;}
. Xg2 {color: {MIDTEXT };}
4. Highlight text (1 is orange, 2 is blue)
. Xi1,. onerror {color: {NOTICETEXT };}
. Xi2,. xi2 a,. xi3 a {color: {HIGHLIGHTLINK };}
5. Bold text
. Xw0 {font-weight: 400 ;}
. Xw1 {font-weight: 700 ;}
6. the box below
"56">. bbda {border-bottom: 1px dashed {COMMONBORDER };}
. Bbs {border-bottom: 1px solid {COMMONBORDER }! Important ;}
7. remove borders
. Bw0 {border: none! Important ;}
. Bw0_all,. bw0_all th,. bw0_all td {border: none! Important ;}
8. remove background
"56">. bg0_c {background-color: transparent! Important ;}
. Bg0_ I {background-image: none! Important ;}
. Bg0_all {background: none! Important ;}
9. predefined margin
. Mtn {margin-top: 5px! Important ;}
. Mbn {margin-bottom: 5px! Important ;}
. Mtm {margin-top: 10px! Important ;}
. Mbm {margin-bottom: 10px! Important ;}
. Mtw {margin-top: 20px! Important ;}
. Mbw {margin-bottom: 20px! Important ;}
10. pre-defined padding
. Ptn {padding-top: 5px! Important ;}
. Pbn {padding-bottom: 5px! Important ;}
. Ptm {padding-top: 10px! Important ;}
. Pbm {padding-bottom: 10px! Important ;}
. Ptw {padding-top: 20px! Important ;}
. Pbw {padding-bottom: 20px! Important ;}
11. rounded corner (note: It may be discarded)
"56">. brs,. avt img,. oshr {-moz-border-radius: 5px;-webkit-border-radius: 5px; border-radius: 5px ;}
. Brm {-moz-border-radius: 10px;-webkit-border-radius: 10px; border-radius: 10px ;}
. Brw {-moz-border-radius: 20px;-webkit-border-radius: 20px; border-radius: 20px ;}
12. layout center common container
/* Narrow layout */
. Wp {margin: 0 auto; width: 960px ;}
/* Wide layout */
. Bw {padding: 0 15px ;}
/* Top navigation */
# Toptb {line-height: 24px ;}
/* Page header */
# Hd {border-bottom: {HEADERBORDER} solid {SPECIALBORDER };{ HEADERBGCODE }}
/* Main area of the page */
# Ct {min-height: 300px ;}
/* Tail */
# Ft {padding: 10px 0 50px; border-top: 1px solid {COMMONBORDER}; line-height: 1.8; color: {FOOTERTEXT };}
13. center horizontally and vertically
. Vm {vertical-align: middle ;}
. Hm {text-align: center ;}
14. drop-down menu
"56">. showmenu {padding-right: 16px; background: url ({IMGDIR}/arrwd.gif) no-repeat 100% 50%; cursor: pointer; white-space: nowrap ;}
# Um. showmenu {margin-right:-5px ;}
15. turn the mouse into a pointer
. Cur1 {cursor: pointer ;}
Late at night, write it here first ......
