www.gusucode.com > 一个基于extjs的强大聊天插件源码程序 > 一个基于extjs的强大聊天插件/extjame/ext-jame/css/jame.css

    /**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 * (en) Template for designing a screen layout
 * (de) Gestaltungsvorlage für die Erstellung eines Screenlayouts
 *
 * @file		basemod_draft.css
 * @creator		YAML Builder v0.3 Preview
 * @link		http://builder.yaml.de
 */

@media all
{
 /**
  * Design of the Basic Layout | Gestaltung des YAML Basis-Layouts
  *
  * @section layout-basics
  */

  /* Page margins and background | Randbereiche & Seitenhintergrund */
  body { margin:0;padding:0; }

  /* Layout: Width, Background, Border | Layout: Breite, Hintergrund, Rahmen */
  #page_margins { width: auto;  min-width: 740px; max-width: 90em }
  #page {   }
  #header {   }
  #topnav {   }
  #footer {   }


 /**
  * Formatting of the Content Area | Formatierung der Inhaltsbereichs
  *
  * @section layout-main
  */

  #col1 { float: left; width: 20%;border-right:1px dotted #cecece;height:100%;}
  #col2 { display:none}
  #col3 { width: auto; margin: 0 0 0 20%;}
  #col1_content { padding: 20px 10px 20px 20px }
  #col3_content { padding: 20px 20px 20px 20px }


 /**
  * Design of Additional Layout Elements | Gestaltung weiterer Layoutelemente
  *
  * @section layout-misc
  */


}
/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 * (en) Example of a patch stylesheet for the Internet Explorer
 * (de) Beispiel für ein Anpassungs-Stylesheet für den Internet Explorer
 *
 * @file            patch_layout_draft.css
 * @creator         YAML Builder v0.3 Preview
 * @link	        http://builder.yaml.de
 */


/* Layout independent adjustments | Layout-unabhängige Anpassungen  */
/* @import url(/yaml/core/iehacks.css); */

/* Layout-dependent adjustments | Layout-abhängige Anpassungen */
@media screen
{
/**
  * Bugfix for IE 3-Pixel-Jog Bug
  *
  * @bugfix
  * @affected   IE 5.x/Win, IE6
  * @css-for    IE 5.x/Win, IE6
  * @valid      yes
  */

  * html #col3 {height: 1%}
  * html #col1 {margin-right: -3px}
  * html #col3 {margin-left: 19%}

}

#col3 ul{
	list-style-type:circle;
	text-indent:20px;
	margin-left:20px;
}
div#header{
	position:relative;
	top:0px;
	height:120px;
	width:100%;
	background-image:url("../images/jame/topbar.gif");
	background-repeat:repeat-x;
}
div#footer{
	position:absolute;
	bottom:0px;
	height:30px;
	width:100%;
	background-image:url("../images/jame/bottombar.gif");
	background-repeat:repeat-x;
	text-align:center;
	font-size:8pt;
	color:white;
}
#footer p{
	margin-top:10px;
}
ul#navi{
	list-style-type:none;
	padding:10px;
}
ul#navi li{
	color:#cecece;
}
ul#navi a{
	color:#cecece;
	text-decoration:none;
}
ul#navi a:hover{
		text-decoration:underline;
		color:black;
}
a#logo{
	z-index:0;
	position:relative;
	top:5%;
	left:20%;
}
#jame-container{
	z-index:1;
	position:absolute;
	right:20px;
	top:70px;
}
div#update-container {
	display:none;
}

.techs{
	list-style-type:circle!important;
	list-style-position:outside!important;
	margin-left:5%!important;
}
.techs li{
	font-size:10pt;
	color:gray;
}

.available{
	background-image:url('../images/jame/icon_available.png') !important
}
.unavailable{
	background-image:url('../images/jame/icon_unavailable.png') !important
}
.xa{
	background-image:url('../images/jame/icon_xa.png') !important
}
.dnd{
	background-image:url('../images/jame/icon_dnd.png') !important
}
.away{
	background-image:url('../images/jame/icon_away.png') !important
}
.chat{
	background-image:url('../images/jame/icon_chat.png') !important
}
.invisible{
	background-image:url('../images/jame/icon_invisible.png') !important
}