css_common.htm

Discuz功能源码（开源）

/*
common.css Official Style for Discuz!(R)
URL: http://www.discuz.net
(C) 2001-2009 Comsenz Inc.
*/

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Common Style ~~~~ */
* { word-wrap: break-word; }
body { {BGCODE}; text-align: center; }
body, td, input, textarea, select, button { color: {TABLETEXT}; font: {FONTSIZE}/1.6em {FONT}; }
input, select, button { vertical-align:middle; }
body, ul, li, dl, dd, p, h1, h2, h3, h4, h5, h6, form, fieldset { margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6 { font-size: 1em; }
ul li { list-style: none; }
a { text-decoration: none; color: {LINK}; }
	a:hover { text-decoration: underline; }
	.lightlink, .lightlink a { color: {HIGHLIGHTLINK}; }
	a img { border: none; }
em, cite, strong, th { text-align: left; font-style: normal; }
.emfont { color: {NOTICETEXT}; }
table { empty-cells: show; border-collapse: collapse; }
th { font-weight: 400; }
.txt, .txtarea { padding: 2px; *padding:0 2px; height: 16px; *height:20px; border: 1px solid; border-color: {INPUTBORDERDARKCOLOR} {INPUTBORDER} {INPUTBORDER} {INPUTBORDERDARKCOLOR}; background: {INPUTBG}; }
	.txtarea { height: auto; }
.checkbox, .radio { margin: 0; width: 15px; }
.pipe { margin: 0 5px; }
.lighttxt, .lighttxt a, .pipe { color: {LIGHTTEXT}; }
.smalltext { font-size: {SMFONTSIZE}; font-family: {SMFONT}; }
.noborder, .noborder td { border: none !important; }
.nobg { background: none !important; }
.right { float: right; }
.left { float: left; }

.onerror, .onright { clear: both; padding: 2px 2px 2px 22px; background: url({IMGDIR}/check_error.gif) no-repeat 2px 2px; }
.onright { background: url({IMGDIR}/check_right.gif) no-repeat 2px 2px; }
.notice { clear: both; margin: 5px 0; padding: 3px 5px 3px 20px; background: url({IMGDIR}/notice.gif) no-repeat 2px 6px; }
.nodata { margin: 99px auto; text-align: center; color: {LIGHTTEXT}; font-size: 16px; font-weight: 700; }

.external { padding-right: 10px; background: url({IMGDIR}/external_link.gif) no-repeat 100% 49.5%; }
#ajaxwaitid { display: none; position: absolute; z-index: 100; top: 0; right: 0; width: 100px; height: 1.6em; background: #D00; line-height: 1.6em; color: #FFF; overflow: hidden; }

#checksecanswer img, #checksecanswer3 img, #checkseccodeverify img, #checkseccodeverify3 img, .warning img { vertical-align: middle; }
.autosave { behavior: url(#default#userdata); }

/*clearfix*/
.s_clear:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.s_clear { zoom: 1; }

/* Lines */
hr { clear: both; margin: 1em 0; border: 0 solid {COMMONBORDER}; background: transparent; }
.solidline { border-top: 1px solid {WRAPBG}; border-bottom-width: 1px; }
.dashline { height: 0px; border-bottom-width: 1px; border-style: dashed; }
.shadowline { *margin: 2px 0; border-width: 1px 0; border-top-color: #C8DCEC; border-bottom-color: #FFF; }
	.side .shadowline { margin: 5px 0; *margin: 2px 0; }

/*此处无需替换为变量*/
.cornerlayger { padding: 6px 8px; border: 1px solid #09C; background: #EBF2F8; line-height: 1.6em; }
.minicorner { margin-top: -1px; height: 6px; background: url({IMGDIR}/attachinfobg.gif) no-repeat 50% 0; }
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ LAYOUT 页面结构 & Block Style ~~~~ */

.wrap { text-align: left; margin: 0 auto; }
	#wrap { padding-bottom: 10px; min-height: 450px; border: {WRAPBORDER} solid {WRAPBORDERCOLOR}; background-color: {WRAPBG}; clear: both; }
		* html #wrap { height: 450px; }
	.wrap, #nav { width: {WRAPWIDTH}; }
#header { margin-bottom: 8px; width: 100%; border-bottom: {HEADERBORDER} solid {HEADERBORDERCOLOR}; {HEADERBGCODE}; }
	#header .wrap { position: relative; padding: 24px 0 22px; }
	#header h2 { float: left; }
	#umenu { position: absolute; right: 0; top: 0; line-height: 20px; }
		#umenu a { margin: 0 6px; }
			#umenu cite { font-weight: 700; }
				#umenu cite span a { margin: 0; font-weight: 400; }
		#pm_ntc.new, #task_ntc.new { padding-left: 22px; background: url({IMGDIR}/notice_newpm.gif) no-repeat 0 50%; }
			#task_ntc.new { padding-left: 15px; background-image: url({IMGDIR}/icon_task.gif); }
			#pm_ntc_menu { margin-left: -27px; padding-top: 10px; width: 250px; background: transparent url({IMGDIR}/pm_ntc.gif) no-repeat 0 0; text-align: left; opacity: 0.98; }
				#pm_ntc_view { padding-bottom: 10px; background: transparent url({IMGDIR}/pm_ntc.gif) no-repeat -250px 100%; }
					#pm_ntc_menu ul { padding: 0 10px; border: solid #91C8E2; border-width: 0 2px; background: #FEFEFE; }
						#pm_ntc_menu li { height: 29px; border-bottom: 1px solid #F4F4F4; line-height: 29px; }
							#pm_ntc_menu a { display: block; width: 100%; color: {LIGHTTEXT}; overflow: hidden; text-overflow: ellipsis; -webkit-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -o-text-overflow: ellipsis; white-space: nowrap; }
								#pm_ntc_menu a em { padding-right: 8px; color: #333; }
								#pm_ntc_menu a:hover { text-decoration: none; color: {HIGHLIGHTLINK}; }
			#uchome_ntc { padding: 1px 10px 3px 15px; *padding: 2px 10px 2px 15px; background: url({IMGDIR}/notify_bg_m.gif) no-repeat 0 50%; color: #FFF !important; }
				#uchome_ntc a { margin: 0; }
		#umenu, #umenu a, #umenu .pipe { color: {HEADERTEXT}; }
#footer { padding: 1em 0; }
	#rightinfo { float: left; }
	#footlink { float: right; text-align: right; }
	#footer, #footer a { color: {FOOTERTEXT}; }

.content { padding: 20px 25px; }
	.content h1 { margin-bottom: 10px; font-size: 16px; font-weight: 400; }
	
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ BLOCK 导航、分页、快速发帖等各种功能块 ~~~~ */
/*菜单*/
#menu { position: absolute; right: 0; bottom: 0; _bottom: -2px; height: 26px; }
	#menu li { display: inline; float: left; margin-left: 5px; {MENUBGCODE}; }
		#menu a { float: left; padding: 0 14px; height: 25px; border: solid {MENUBORDER}; border-width: 1px 1px 0; background: transparent none; line-height: 25px; color: {MENUTEXT}; text-decoration: none; overflow: hidden; }
			#menu a.dropmenu { padding-right: 20px; background-image: url({IMGDIR}/arrow_down.gif); background-repeat: no-repeat; background-position: 95% 50%; }
		#menu a:hover { border-color: {HEADERBORDERCOLOR}; background-color: {MENUHOVER}; color: {MENUHOVERTEXT}; }
		#menu li.current a { height: 26px; border-color: {HEADERBORDERCOLOR}; background-color: {MENUHOVER}; color: {MENUHOVERTEXT}; }

#nav { margin: -8px auto 0; background: url({IMGDIR}/icon_nav.gif) no-repeat 0 50%; text-align: left; text-indent: 25px; line-height: 3em; }
	#nav, #nav a { color: {MENUHOVERTEXT}; }

.mainbox table { width: 100%; }

.foruminfo { margin-top: 5px; line-height: 30px; }
	#ann dt { float: left; width: 5em; background: url({IMGDIR}/ann_icon.gif) no-repeat 0 50%; text-indent: 2em; font-weight: 700; }
	#ann dd { margin-left: 30px; }
		#ann li {  padding-left: 10px; white-space: nowrap; }
			#ann em { margin-left: 5px; color: {MIDTEXT}; font-size: 0.83em; }
	#annbody { height: 30px; overflow: hidden; padding-right: 16px; }
	.forumcount { margin-left: 16px; }

.blocktitle { margin-bottom: 0.5em; font-size: 16px; font-weight: 700; }

.channelinfo { clear: both; margin: 5px 0; color: {MIDTEXT}; }
	.channelinfo img { vertical-align: middle; }
	.channelinfo .onerror { * background-position: 2px 0; }

.pages_btns { padding: 5px 0 1em; line-height: 30px; }
	.postbtn, .replybtn, #modopt, #modopttmp { float: left;  margin-right: 10px; color: {HIGHLIGHTLINK}; cursor: pointer; }
		#modopt, #modopttmp, .threadlist tfoot a { background-color: {INPUTBG}; border: 1px solid; border-color: {INPUTBORDERDARKCOLOR} {INPUTBORDER} {INPUTBORDER} {INPUTBORDERDARKCOLOR}; padding: 0 16px 0 6px; line-height: 20px; }
			.threadlist tfoot a { margin-right: 5px; padding: 3px 16px 3px 3px; }
			#modopt:hover, #modopttmp:hover, .threadlist tfoot a:hover { text-decoration: none; color: {HIGHLIGHTLINK}; }
	.postbtn, .replybtn { width: 67px; height: 30px; background: url({IMGDIR}/newtopic.gif) no-repeat 0 0; font-size: 14px; font-weight: 700; line-height: 28px; *line-height: 32px; text-align: center; overflow: hidden; }
		.replybtn { background-image: url({IMGDIR}/reply.gif); }
		.postbtn a, .replybtn a { display: block; padding-left: 5px; color: #FFF; letter-spacing: 5px; }
		.postbtn a:hover, .replybtn a:hover { text-decoration: none; }

.pages, .pageback { float: right; padding: 2px 0; }
	.pages a, .pages strong, .pageback a { float: left; padding: 0 6px; margin-right: 2px; height: 20px; border: 1px solid; line-height: 20px; overflow: hidden; }
		.pages a, .pageback a { border-color: {COMMONBORDER}; background-color: {WRAPBG}; color: {HIGHLIGHTLINK}; }
		.pages a:hover, .pageback a:hover { text-decoration: none; }
		.pages strong { border-color: {HIGHLIGHTLINK}; background-color: {HIGHLIGHTLINK}; color: #FFF; font-weight: 700; }
			.pages a.prev, .pages a.next { background-repeat: no-repeat; }
		.pages a.prev { background-image: url({IMGDIR}/arrow_left.gif); background-position: 30% 50%; padding: 0; width: 22px; overflow: hidden; text-indent: -9999px; }
		.pages a.next { padding-right: 16px; background-image: url({IMGDIR}/arrow_right.gif); background-position: 90% 50%; }
	.pageback a { padding-left: 16px; background: {WRAPBG} url({IMGDIR}/arrow_left.gif) no-repeat 0 50%; }
	.pages a:hover, .pageback a, .pages a.next { border-color: {HIGHLIGHTLINK}; }

/* TAG 标签云 */
.taglist { margin: 20px 10px; }
	.taglist a { height: 30px; line-height: 30px; margin-right: 20px; word-break: keep-all;  }
	#infoside .taglist a { margin-right: 10px; height: 22px; line-height: 22px; }
		/*TAG颜色无需替换为变量*/
		a.tagl1, a.tagl2 { font-size: 12px; color: #666 !important; }
		a.tagl2 { color: #999 !important; }
		a.tagl3 { font-size: 14px; color: #090 !important; }
		a.tagl4 { font-size: 16px; color: #09C !important; }
		a.tagl5 { font-size: 18px; color: #F60 !important; }
/*左右结构的表格（多用于表单）*/
.formtable { width: 100%; }
	.formtable th { padding: 5px 2px; width: 100px; }
		.formtable th a { font-weight:400; color:{HIGHLIGHTLINK}; text-decoration:underline; }
	.formtable td { padding: 5px 2px; }
	.formtable .sep_space th { height: 40px; }
	.formtable .txt { width: 270px; }
	.formtable .txtarea { float: left; margin: -1px 8px 0 0; width: 270px; height: 60px; border-top-color: {INPUTBORDER}; }
.float_typeid { float: left; margin-right: 6px; }
	.float_typeid select { float: left; height: 20px; }
	.float_typeid a { display: block; overflow: hidden; text-indent: 4px; padding-right: 17px; width: 77px; height: 20px; *padding-top: 2px; *height: 18px; text-decoration: none !important; color: {TABLETEXT} !important; border: 1px solid; border-color: {INPUTBORDERDARKCOLOR} {INPUTBORDER} {INPUTBORDER} {INPUTBORDERDARKCOLOR}; background: {INPUTBG} url({IMGDIR}/newarow.gif) no-repeat 100% 0; }
		.float_typeid a:hover { text-decoration: none; border: 1px solid {HIGHLIGHTLINK}; background-position: 100% -20px; }
		.float_postinfo .float_typeid a { line-height: 20px; *line-height: 18px; }
	.float_typeid ul{ margin: -22px 0 0; border: 1px solid {HIGHLIGHTLINK}; background:{INPUTBG} url({IMGDIR}/newarow.gif) no-repeat 100% -20px; }
		* html .float_typeid ul { margin-top: -23px; }
		.float_typeid ul li { margin: 0 4px; color: {TABLETEXT}; cursor: pointer; }
		.float_typeid ul li:hover { color: {HIGHLIGHTLINK}; }
		.newselect .current { font-weight: 700; }
	/* ctrl 'select' width */
	.float_typeid select { width: 94px; }
	.short_select a{ width: 43px; }
	.short_select select { width: 60px; }

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ LIST 列表：版块列表、帖子列表、用户列表以及其他形式列表 ~~~~ */

.commonlist li { margin: 4px 0; }
.inlinelist li { float: left; width: 33%; }
	.inlinelist li.wide { width: 49.5%; }
.titlelist li { margin: 3px 0; height: 1.6em; background: url({IMGDIR}/dot.gif) no-repeat 8px 9px;  overflow: hidden; }
	.titlelist li a { padding-left: 1.5em; }
		.titlelist li cite { padding: 0 0 0 5px; }