css的使用

1、background的一些疑惑：

background: url(../images/member_centerDetail_top.png) no-repeat 10px 8px;

url是指定引用的图片的路径；

no-repeat是表示图片不重复；

10px 8px 是表示图片左上顶点相对于外层dom（例如：div）对象的左上顶点的水平位置10px，垂直位置8px。这两个值和background-position 属性是一样的，即设置背景图像的起始位置。

----------------------------------------------------------

.memberCenter .memberCenterDetail .top {
 background: url(../images/member_centerDetail_top.png) no-repeat 10px 8px;
 border: 1px solid #CCCCCC;
 width: 940px;
 height: 45px;
 line-height: 40px;
 padding-left: 40px;
 clear: both;
 font-size: 14px;
 font-weight: bold;
 color: #595959;
 overflow: hidden;
 }

==>

指定类样式为memberCenter的div 中类样式为memberCenterDetail的div 中类样式为top的div的样式。

 

2、解决长串英文显示不能自动换行的问题

例如：aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa不能处理自动换行，将表格伸的很长很长，而汉字字符却可以自动换行。

原因是：
英文字母之间如果没有空格，系统认为是一个单词，就不会自动换行。汉字就没有这种情况。

解决办法：
用表格把要显示的内容装起来。
在<table>标签中加入“style='TABLE-LAYOUT: fixed'”,
在需要强制单词换行的<td>标签中加入“style='word-WRAP: break-word'”。
这样就可以了。

例如：

 

<table class="inputTable tabContent" style="TABLE-LAYOUT: fixed">
			<tr class="title">
				<th style="width:10%">日志类型</th>
				<th style="width:10%">操作员</th>
				<th style="width:60%">日志信息</th>
				<th style="width:20%">操作时间</th>
			</tr>
			<#list order.orderLogSet as list>
				<tr>
					<td>
						${action.getText("OrderLogType." + list.orderLogType)}
					</td>
					<td>
						${list.operator}
					</td>
					<td style="word-WRAP: break-word">
						${list.info}
					</td>
					<td>
						<span title="${list.createDate?string("yyyy-MM-dd HH:mm:ss")}">${list.createDate}</span>
					</td>
				</tr>
			</#list>
		</table>

 参考文章网址：http://hi.baidu.com/mengqing723/item/12c708fe09fc33ec1b111ff5