._______________Gernal_______________ {
}

#content {
	/* [disabled]width: 975px; */
}
#content-mid {
	width: 945px;
	overflow: hidden;
	padding-top: 10px;
	margin-right: auto;
	margin-left: auto;
}

內容區 - 前段

.____________Content-Header____________ {
}

主看板

#mainbanner {
	height: 325px;
	width: 700px;
	float: left;
	margin-top: 5px;
	margin-left: 5px;
}

#content-header {
	height: 325px;
	width: 955px;
	background: #FFF;
	margin-bottom: 5px;
	margin-right: auto;
	margin-left: auto;
	overflow: hidden;
}
#meeting-form {
	width: 240px;
	margin-top: 5px;
	float: right;
	height: 325px;
	margin-left: 5px;
	margin-right: 5px;
}

導覽列

._______________Nav_______________ {
}
.______135-270-405-540-675-810______ {
}

#nav {
	height: 50px;
	width: 100%;
	background: url(../images-u/nav/nav-bg.jpg) repeat-x;
	margin-right: auto;
	margin-left: auto;
}

#nav li{
	float: left;
	height: 50px;
	width: 135px;
	list-style: none;

}
#nav li a {
	height: 50px;
	width: 135px;
	display: block;
}
#nav .nav-btn-normal {
	height: 50px;
	width: 975px;
	background: url(../images-u/nav/nav-btn.gif) no-repeat 5px -50px;
	margin-right: auto;
	margin-left: auto;
}
#nav .nav01-current {
	background: url(../images-u/nav/nav-btn.gif) no-repeat 0px 0px;
}
#nav .nav02-current {
	background: url(../images-u/nav/nav-btn.gif) no-repeat -135px 0px;
}
#nav .nav03-current {
	background: url(../images-u/nav/nav-btn.gif) no-repeat -270px 0px;
}
#nav .nav04-current {
	background: url(../images-u/nav/nav-btn.gif) no-repeat -405px 0px;
}
#nav .nav05-current {
	background: url(../images-u/nav/nav-btn.gif) no-repeat -540px 0px;
}
#nav .nav06-current {
	background: url(../images-u/nav/nav-btn.gif) no-repeat -675px 0px;
}
#nav .nav07-current {
	background: url(../images-u/nav/nav-btn.gif) no-repeat -810px 0px;
}

#nav ul {
	margin: 0px 5px;
	padding: 0px;
	background: #FFF;
}
#nav .nav01 a:hover {
	height: 50px;
	width: 135px;
	display: block;
	background: url(../images-u/nav/nav-btn.gif) 0px bottom;
}
#nav .nav02 a:hover {
	height: 50px;
	width: 135px;
	display: block;
	background: url(../images-u/nav/nav-btn.gif) -135px bottom;
}
#nav .nav03 a:hover {
	height: 50px;
	width: 135px;
	display: block;
	background: url(../images-u/nav/nav-btn.gif) -270px bottom;
}
#nav .nav04 a:hover {
	height: 50px;
	width: 135px;
	display: block;
	background: url(../images-u/nav/nav-btn.gif) -405px bottom;
}
#nav .nav05 a:hover {
	height: 50px;
	width: 135px;
	display: block;
	background: url(../images-u/nav/nav-btn.gif) -540px bottom;
}
#nav .nav06 a:hover {
	height: 50px;
	width: 135px;
	display: block;
	background: url(../images-u/nav/nav-btn.gif) -675px bottom;
}
#nav .nav07 a:hover {
	height: 50px;
	width: 135px;
	display: block;
	background: url(../images-u/nav/nav-btn.gif) -810px bottom;
}

導覽列文字樣式

._____________Nav-Text-Alt_______________ {
}
#nav-w {
	height: 50px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}
#nav-w ul {
	margin: 0px auto;
	padding: 0px;
	background: #FFF;
	width: 1125px;
}
#nav-w li{
	float: left;
	height: 40px;
	width: 135px;
	list-style: none;
	color: #FFF;
	text-align: center;
	padding-top: 10px;
	font: bold 13px/14px "微軟正黑體";
}
#nav-w a  {
	height: 37px;
	width: 135px;
	display: block;
	color: #EEE;
	text-decoration: none;
	padding-top: 3px;
	background: url(../images-u/nav/nav-btn-bg.gif) no-repeat center bottom;
}
#nav-w a:hover {
	color: #222;
}
#nav-w .hot-course {
	background: url(../images-u/nav/nav-hot.png) no-repeat;
	height: 25px;
	width: 60px;
	margin-top: 5px;
}

切換成不同的class，可以改變色帶的顏色

.nav-android .current {
	background: url(../images-u/nav/tag-android.gif) no-repeat;
}
.nav-android {
	background: url(../images-u/nav/nav-bg-android.gif) repeat-x;
}
.nav-embedded .current {
	background: url(../images-u/nav/tag-embedded.gif) no-repeat;
}
.nav-embedded {
	background: url(../images-u/nav/nav-bg-embedded.gif) repeat-x;
}
.nav-sc {
	background: url(../images-u/nav/nav-bg-sc.gif) repeat-x;
}
.nav-sc .current {
	background: url(../images-u/nav/tag-sc.gif) no-repeat;
}
.nav-module .current {
	background: url(../images-u/nav/tag-module.gif) no-repeat;
}
.nav-android {
	background: url(../images-u/nav/nav-bg-android.gif) repeat-x;
}
.nav-module {
	background: url(../images-u/nav/nav-bg-module.gif) repeat-x;
}
#subnav-w {
	height: 40px;
	width: 100%;
}
#subnav-w li {
	float: left;
	list-style: none;
	margin-right: 5px;
	margin-left: 5px;
	color: #FFF;

}
#subnav-w li a {
	color: #FFF;
}
#subnav-w ul {
	padding: 0px;
	/* [disabled]margin-left: 500px; */
}

次導覽定位

.subnav-col-1 {
	margin-left: 10px;
}
.subnav-col-2 {
	margin-left: 100px;
}
.subnav-col-3 {
	margin-left: 200px;
}
.subnav-col-4 {
	margin-left: 250px;
}
.subnav-col-5 {
	margin-left: 300px;
}
.subnav-col-6 {
	margin-left: 250px;
}
.subnav-col-7 {
	margin-left: 300px;
}


._______________SubNav_______________ {
}

#subnav li {
	float: left;
	list-style: none;
	margin-right: 5px;
	margin-left: 5px;
	color: #FFF;

}
#subnav li a {
	color: #FFF;
}

#subnav ul {
	padding: 0px;
	/* [disabled]margin-left: 500px; */
}
#subnav {
	height: 40px;
	width: 100%;
	background: url(../images-u/nav/nav-bg.jpg) repeat-x center -49px;
}
#subnav-inner {
	height: 30px;
	width: 975px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 10px;
}
.subnav07 {
	margin-left: 450px;
}

主體(側欄左方內容)

._______________Main_______________ {
}
#main .block-border{
	height: 100%;
	width: 550px;
	border: 1px solid #CCC;
	padding: 0px 30px 20px;
	overflow: hidden;
}

#main {
	float: left;
	width: 630px;
	overflow: auto;
	/* [disabled]position: absolute; */
	/* [disabled]height: 100%; */
}
.main-header-padding {
	margin-bottom: 10px;
	position: relative;
}
#main p {
	line-height: 25px;
	text-align: justify;
}
#main hr {
	border-top: 1px dashed #CCC;
	border-right: 0px dashed #CCC;
	border-bottom: 0px dashed #CCC;
	border-left: 0px dashed #CCC;
	background: #FFF;
	height: 1px;
	margin-top: 3px;
	margin-bottom: 3px;
}

#main em {
	color: #00678C;
	font-weight: bold;
	font-style: normal;
}
#main .em {
	color: #00678C;
	font-weight: bold;
	font-style: normal;
}
#main strong {
	color: #900;
	font-weight: bold;
	font-style: normal;
}


#main h1 {
	color: #519216;
	margin-top: 0px;
	margin-bottom: 0px;
	font-weight: 600;
	display: inline;
}
#main h2 {
	color: #519216;
	margin-top: 0px;
	margin-bottom: 0px;
	font-weight: bold;
	font-size: 13px;
	display: inline;
}

#main .top-btn {
	height: 30px;
	width: 85px;
	margin-left: auto;
	margin-top: 10px;
	background: url(../images-u/content/back-top.gif) no-repeat center top;
}
#main .top-btn a {
	background: center bottom;
	display: block;
	height: 30px;
	width: 85px;
}
#main .top-btn a:hover {
	background: url(../images-u/content/back-top.gif) center bottom;
}

簡介

._______________Main-Intro_________ {
}
#fb-recommend {
	border:none;
	overflow:hidden;
	width:100px;
	height:35px;
	position: absolute;
	left: 320px;
	top: 22px;
}
#intro blockquote {
	background: #FFC;
	height: 100%;
	width: 500px;
	border: 1px solid #CCC;
	margin: 0px;
	padding: 10px;
	float: left;
}
#intro {
	position: relative;
}

#intro blockquote li {
	margin: 0px 0px 0px 30px;
	padding: 0px;
	color: #333;
}
#intro .subject {
	width: 70px;
}
#intro .skills {
	margin-left: 20px;
	line-height: 20px;
	list-style: none;
	margin-top: 10px;
}
#intro .skills li strong {
	color: #000;
}
.main-block {
	width: 610px;
	margin-bottom: 20px;
}
.class-title {
	background: #f0f8fb;
	height: 30px;
	width: 530px;
	border-top: 0px dashed #779DDC;
	border-right: 0px dashed #779DDC;
	border-bottom: 1px dashed #779DDC;
	border-left: 0px dashed #779DDC;
	color: #0066AE;
	line-height: 30px;
	padding-left: 20px;
}
#switch-tag {
	height: 41px;
	width: 610px;
}

#switch-tag li {
	float: left;
	list-style: none;
}
#switch-tag  {
	display: block;
	overflow: hidden;
}
.btn-intro {
	margin-top: 15px;
	margin-left: 15px;
}

課程內容

._________Main-Course-Content____________ {
}
#intro .h1pic {
	height: 70px;
	width: 100px;
	position: absolute;
	z-index: 1;
	top: 10px;
	right: 20px;
}
#course-content .broder-clear {
	border-bottom-width: 0px;
	border-bottom-style: none;
}


#course-content .open-index {
	position: absolute;
	z-index: auto;
	height: 20px;
	width: 70px;
	right: 10px;
	top: 5px;
}
#course-content {
	position: relative;
	overflow: hidden;
}

#swDiv1 {
	/* [disabled]overflow: hidden; */
}

#class-content {
	background: url(../images-u/content/main/header/course-content.jpg);
	height: 41px;
	width: 203px;
}
.date-r-float {
	display: block;
	float: right;
	margin-right: 70px;
}
.course-step {
	height: 25px;
	color: #FFF;
	margin: 10px 10px 10px 0px;
	display: block;
	clear: both;
	letter-spacing: 5px;
	text-align: center;
	font: bold 15px "微軟正黑體";
}
.step-bg {
	background: url(../images-u/content/course-step-bg.png) repeat-x;
	height: 25px;
	text-indent: 5px;
}


#course-content ul {
	padding-top: 5px;
	padding-bottom: 15px;
	float: left;
	width: 250px;
	display: block;
}



#course-content li {
	list-style: url(../images-u/list-style/list-content.gif);
	line-height: 25px;
	margin-left: 15px;
	border-bottom: 1px dashed #CCC;
}
#course-content .full-length-list {
	width: 500px;
}
#course-content .sub-list {
	float: none;
	width: 480px;
	padding: 0px;
	overflow: hidden;
	margin-left: 20px;

}
#course-content .sub-list li{
	list-style: square;
	border-width: 0px;
	float: left;
	margin-left: 30px;
	color: #666;

}
#course-content .clear-border {
	border-width: 0px;
}


#course-content dt {
	clear: left;
}
#course-content dd {
	margin-left: 30px;
	overflow: visible;
}
.course-content ul {
	padding-top: 5px;
	padding-bottom: 15px;
	float: left;
	width: 250px;
	display: block;
}
.course-content {
	overflow: hidden;
}

.course-content li {
	list-style: url(../images-u/list-style/list-content.gif);
	line-height: 25px;
	margin-left: 15px;
	border-bottom: 1px dashed #CCC;
}
.course-content .full-length-list {
	width: 500px;
}
.course-content .sub-list {
	float: none;
	width: 480px;
	padding: 0px;
	overflow: hidden;
	margin-left: 20px;

}
.course-content .sub-list li{
	list-style: square;
	border-width: 0px;
	float: left;
	margin-left: 30px;
	color: #666;

}
.course-content .clear-border {
	border-width: 0px;
}
.course-content dt {
	clear: left;
}
.course-content dd {
	margin-left: 30px;
	overflow: visible;
}
#superiority .text-alt {
	color: #0066AE;
}
#superiority {
	font-size: 12px;
	line-height: 25px;
}
#superiority li {
	list-style: circle url(../images-u/list-style/list-content.gif);
	border-bottom: 1px dashed #CCC;
	margin-left: 20px;
}
#superiority h2{
	background: #f0f8fb;
	height: 30px;
	width: 530px;
	border-top: 1px dashed #779DDC;
	border-right: 0px dashed #779DDC;
	border-bottom: 1px dashed #779DDC;
	border-left: 0px dashed #779DDC;
	color: #0066AE;
	line-height: 30px;
	padding-left: 20px;
	display: block;
	font-size: 12px;
	margin-top: 20px;
}
#superiority ul {
	overflow: auto;
	display: block;
	list-style: url(../images-u/list-style/list-content.gif);

}
#practice ul {
	padding: 0px;
}
#practice li {
	line-height: 28px;
}

#practice .course-content {
	margin: 0px;
}

側欄

._______________SideBar_______________ {
}

#sidebar {
	float: right;
	width: 300px;
	height: 100%;
	line-height: 20px;
}
#sidebar h2 {
	color:#519216;
	margin:5px;
}
#member-service  {
	padding: 0px;
	margin: 0px;
	border: 1px solid #CCC;
}
#class-date {
	color: #666;
}

#class-date a {
	font-weight: bold;
}

#class-date .title {
	color: #519216;
	font-size: 16px;
	margin: 0px 0px 10px;
	font-weight: bold;
}
#class-date em {
	color: #00678C;
	font-style: normal;
}
#class-date .bold {
	color: #C00;
	font-weight: bold;
}
#location em {
	color: #00678C;
	font-style: normal;
}
#location strong {
	color: #C00;
}
#intro .info {
	line-height: 25px;
	color: #0066AE;
}
#intro .info .subject {
	font-weight: bold;
	color: #333;
}


.sidebar-block {
	margin-bottom: 10px;
}


#sidebar hr {
	height: 1px;
	border-top: 1px dashed #999;
	border-right: 0px dashed #999;
	border-bottom: 0px dashed #999;
	border-left: 0px dashed #999;
	margin-top: 5px;
	margin-bottom: 10px;
}
#sidebar .block-border{
	height: 100%;
	width: 268px;
	border: 1px solid #CCC;
	padding: 15px;
}
#consult-btn {
	height: 65px;
	width: 300px;
	background: url(../images-u/content/sidebar/consult-btn.gif);
	margin-bottom: 10px;
}
#consult-btn a {
	display: block;
	height: 65px;
	width: 300px;
	text-decoration: none;
}
#location strong {
	margin-left: 15px;
}

#consult-btn a:hover {
	background: url(../images-u/content/sidebar/consult-btn.gif) center bottom;
}
#application-form-download {
	height: 65px;
	width: 300px;
	background: url(../images-u/content/sidebar/application-form-download.gif);
	margin-bottom: 10px;
}
#application-form-download a {
	display: block;
	height: 65px;
	width: 300px;
	text-decoration: none;
}
#application-form-download a:hover {
	background: url(../images-u/content/sidebar/application-form-download.gif) center bottom;
}
#demo h2 {
	color: #0066AE;
	font-size: 12px;
	margin: 0px;
}
#demo {
	text-align: center;
}
#demo hr {
	margin-top: 10px;
	margin-bottom: 10px;
}

#demo iframe {
	height: 235px;
	width: 280px;
	display: block;
	margin-right: auto;
	margin-left: auto;
}

#demo .block-border {
	padding-right: 0px;
	padding-left: 0px;
	width: 298px;
}
#feedback p {
	text-indent: 2em;
	line-height: 25px;
}
.feedback-title {
	font-size: 14px;
	color: #C00;
	font-weight: bold;
}
.feedback-name {
	background: #F0F8FB;
	color: #0066AE;
}
#feedback a {
	float: right;
}
#feedback td {
	padding: 5px 10px;
}
.feedback-avatar {
	margin: 0px 0px 0px 3px;
}
#feedback strong {
	color: #C00;
	font-weight: normal;
}

頁尾導航

._______________content-bottom_______________ {
}
#learning-environment {
	background: url(../images-u/content/main/learning-environment-bg.jpg) no-repeat center bottom;
	text-align: center;
	width: 100%;
}

#subnav-bottom {
	height: 30px;
	border-top: 1px dotted #FFF;
	border-bottom: 1px dotted #FFF;
	border-right: 0px dotted #FFF;
	border-left: 0px dotted #FFF;
}
#subnav-bottom li {
	float: left;
	list-style: none;
	margin-right: 5px;
	margin-left: 5px;
	color: #FFF;

}
.subnav-bottom-org {
	background: url(../images-u/nav/subnav-android.gif) repeat-x;
}
.subnav-bottom-embedded {
	background: url(../images-u/nav/subnav-embedded.gif) repeat-x;
}
.subnav-bottom-android {
	background: url(../images-u/nav/subnav-android.gif) repeat-x;
}
.subnav-bottom-module {
	background: url(../images-u/nav/subnav-module.gif) repeat-x;
}
.subnav-bottom-sc {
	background: url(../images-u/nav/subnav-sc.gif) repeat-x;
}

#subnav-bottom ul {
	margin-top: 8px;
	margin-right: auto;
	margin-left: auto;
}

#subnav-bottom li a {
	color: #FFF;
}

#nav-bottom {
	height: 40px;
	background: #333;
	padding-top: 3px;
	line-height: 18px;
	font-size: 12px;
	text-align: center;
}
#nav-bottom li {
	list-style: none;
	margin-right: 5px;
	margin-left: 5px;
	color: #FFF;
	display: inline;

}
#nav-bottom ul {
	display: block;
	height: 18px;
	margin: 0px auto;
	text-align: center;
	width: 650px;
}
#nav-bottom li a {
	color: #FFF;
	text-decoration: none;
}
#nav-bottom li a:hover {
	color: #FC0;
	text-decoration: none;
}