我有下面的HTML表格。
jsfiddle链接:
<table id="tabla" align="center" cellspacing="15" cellpadding="0">
<tr>
<td><input type="button" value="Form View"></input></td>
<td><input type="button" value="Table view"></input></td>
</tr>
<tr>
<td>Classification1:</td>
<td>value</td>
<td>Source:</td>
<td>value</td>
<td>Sic1:</td>
<td>Value</td>
<td>Sic Description1:</td>
<td>value</td>
<td>Source:</td>
<td>value</td>
</tr>
<tr>
<td>Classification1:</td>
<td>value</td>
<td>Source:</td>
<td>value</td>
<td>Sic1:</td>
<td>Value</td>
<td>Sic Description1:</td>
<td>value</td>
<td>Source:</td>
<td>value</td>
</tr>
<tr>
<td>Classification1:</td>
<td>value</td>
<td>Source:</td>
<td>value</td>
<td>Sic1:</td>
<td>Value</td>
<td>Sic Description1:</td>
<td>value</td>
<td>Source:</td>
<td>value</td>
</tr>
<tr>
<td>Classification1:</td>
<td>value</td>
<td>Source:</td>
<td>value</td>
<td>Sic1:</td>
<td>Value</td>
<td>Sic Description1:</td>
<td>value</td>
<td>Source:</td>
<td>value</td>
</tr>
</table>
这里每行有多个tds。我想将标签名称改为粗体,但不改为值。
我该怎么做?
前任:
<td>Classification1:</td>
<td>value</td>
这里
Classification1:
应该是粗体,value
应该是正常的。 最佳答案
桌子是这项工作的错误工具!
这有两个原因:
易访问性-使用屏幕阅读器的视力受损的人使用您的网站会更轻松。
搜索引擎将能够更容易地解析网站。
使用数据定义列表:
<dl>
<dt>Classification1:</dt>
<dd>value</dd>
<dt>Source:</dt>
<dd>value</dd>
<dt>Sic1:</dt>
<dd>Value</dd>
<dt>Sic Description1:</dt>
<dd>value</dd>
<dt>Source:</dt>
<dd>value</dd>
</dl>
CSS:
dt, dd {margin-right:10px;margin-left:10px;}
dt {font-weight:bold;}
dl>dd, dl>dt {float:left}
dl:after {clear:both;float:none;display:block;content:'';}
这是复制在这个小提琴:http://jsfiddle.net/netinept/GsG7C/9/