扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
1、首先给table标签添加css : table-layout:fixed;这里是为了让整个table有一个自己宽度,而不是让table自己随着自己内容的大小而改变。
站在用户的角度思考问题,与客户深入沟通,找到彝良网站设计与彝良网站推广的解决方案,凭借多年的经验,让设计与互联网技术结合,创造个性化、用户体验好的作品,建站类型包括:网站设计制作、成都网站建设、企业官网、英文网站、手机端网站、网站推广、域名与空间、网络空间、企业邮箱。业务覆盖彝良地区。
2、给table标签,定一个宽度(如:width:500px);
3、最后给td 定一个宽度(width)就可以实现.
原表格:
添加一下CSS:
现表格:
扩展资料:
在实际需求中,经常遇到要在table中的td中,让用户输入比较长的字符串,这时就要使td的宽度能较大。
在WEB前端中,对于 表格元素中的元素td 直接设置宽度是无法生效的。要想达到给td设置宽度的目地。
指定的table为细边框,把table放在div中即可。
一、首先新建表格,代码如下:
table width="500" border="1" trtdnbsp;/tdtdnbsp;/tdtdnbsp;/td/tr trtdnbsp;/tdtdnbsp;/tdtdnbsp;/td /trtr tdnbsp;/td tdnbsp;/tdtdnbsp;/td/tr/table。
二、在table里加css样式,代码如下:
table width="500" border="1" cellpadding="0" cellspacing="0" style="border-collapse:collapse;" tr tdnbsp;/tdtdnbsp;/td tdnbsp;/td /tr tr tdnbsp;/tdtdnbsp;/tdtdnbsp;/td/tr trtdnbsp;/tdtdnbsp;/tdtdnbsp;/td/table。
三、单元格边距(表格填充)(cellpadding) -- 代表单元格外面的一个距离,用于隔开单元格与单元格空间。单元格间距(表格间距)(cellspacing) -- 代表表格边框与单元格补白的距离,也是单元格补白之间的距离,border-collapse:collapse表示表格的两边框合并为一条即可。
你编写表格的时候可以这样:
把第一列变成th
,这样就可以方便的控制了。
例如:三行三列的表格可以这样写:
table
tbody
tr
th/th
td/tdtd/td
/tr
tr
th/th
td/tdtd/td
/tr
tr
th/th
td/tdtd/td
/tr
/tbody
/table
或者你可以分别设置不同的类来达到控制的目的。
CSS可以这样写
th{
width:100px;
}
td{
width:200px;
}
这个还行
style type="text/css"table.imagetable { font-family: verdana,arial,sans-serif; font-size:11px; color:#333333; border-width: 1px; border-color: #999999; border-collapse: collapse;
}table.imagetable th { background:#b5cfd2 url('cell-blue.jpg'); border-width: 1px; padding: 8px; border-style: solid; border-color: #999999;
}table.imagetable td { background:#dcddc0 url('cell-grey.jpg'); border-width: 1px; padding: 8px; border-style: solid; border-color: #999999;
}
/style
1、普通居中。
align="center"
table align="center"
tr
td商品名称/td
td商品价格/td
td商品描述/td
td购买/td
/tr
/table
2、css样式居中。
margin:0 auto
style type="text/css"
table1{
margin:0 auto;/* 自动居中,不论王爷的大小 */
border:1;/* 边框粗度 */
width:80%;/* 宽度只占当前页面的80% */
}
/style
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流