哪位高手可能详细给出CSS中的TD样式

html-css014

哪位高手可能详细给出CSS中的TD样式,第1张

以下是定义行高代码,数字越大,行与行之间距离越大

.td{

line-height: 12px

}

或者用百分比也行

.td{

line-height: 150%

}

调用时先在<head></head>之间放入

<link href="css.css" rel="stylesheet" type="text/css" />

注意href="css.css"是路径自己定义

调用时用class="td"就行了

例:

<table width="50" >

<tr>

<td class="td">121312313131</td>

</tr>

</table>

直接使用css的标签选择器就可以实现

td input[type='text'] {.../*设置需要的样式*/}

举个例子:

创建Html元素

<table>

<tr>

<td>name</td>

<td><input type="text"></td>

<td>sex</td>

<td><input type="radio" name="sex" checked>男<input type="radio" name="sex">女</td>

</tr>

<tr>

<td>tel.</td>

<td><input type="text"></td>

<td>addr.</td>

<td><input type="text"></td>

</tr>

</table

设置css样式

table{border-collapse: collapse}

td{border:1px solid #cccpadding:5px}

/*设置单元格中文本框的样式*/

td input[type='text']{border:1px solid greenborder-radius:3pxheight:30px}

观察显示效果

1、首先打开hbuilder软件,新建一个html文件,里面设置一个3行一列的table表格。

2、然后在style标签中设置table的样式,给table一个宽度和高度,并且把字体调大,设置背景色;再设置td的样式,给它们添加word-wrap和word-break两个属性就可以了,此css属性表示  在长单词或 URL 地址内部进行换行。

3、然后打开浏览器,就可以看到文字已经自动换行了。