目錄
回复讨论(解决方案)
首頁 web前端 html教學 请教下关于table的宽度问题_html/css_WEB-ITnose

请教下关于table的宽度问题_html/css_WEB-ITnose

Jun 21, 2016 am 09:46 AM

<table width="960" height="200" border="1" align="center" bordercolor="#0033CC" style="border-collapse:collapse" >  <tr>    <th height="50" colspan="5" scope="col"><div align="center"><a href="http://www.15fj.com/" class="STYLE1">2013年-2014年国家法定节假日放假安排/通知</a></div></th>  </tr>  <tr>    <td width="123" height="20">节日</td>    <td width="261" height="20" >放假日期</td>    <td width="246" height="20">调休上班日期</td>    <td width="141"  height="20">放假天数</td>    <td width="163" rowspan="10" >《<a href="http://www.fangjiaanpai.cn/">2014年放假安排时间表</a>》放假安排方案是依据国务院《关于修改全国年节及纪念日放假办法的决定》,参照往年国务院办公厅往年下达的关于部分节假日安排的通知,结合当前工作实际,在坚持科学发展观重要思想指导下做出的。2014年节假日放假安排方案须报请国务院批准方可生效,最终方案将于2013年底予以公布,届时国务院办公厅将以通知的方式下达。以便相关单位及早合理安排节假日旅游、交通运输、生产经营等有关工作,本站现在方案仅供参考!</td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/zhongqiu/" class="STYLE4" >2013中秋</a> </td>    <td >1月1日 - 3日(周二、三、四) </td>    <td>1月5日(周六)、1月6日(周日</td>    <td>3天</td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/guoqing/" class="STYLE4" >2013国庆</a> </td>    <td> 2月9日 - 15日(周六→周五) </td>    <td> 2月16日(周六)、2月17日(周日) </td>    <td> 7天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/yuandan/" class="STYLE4"  >2014元旦</a> </td>    <td> 4月4日 - 6日(周四、五、六) </td>    <td> 4月7日(周日) </td>    <td> 3天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/chunjie/" class="STYLE4" >2014春节</a> </td>    <td> 4月29日 - 5月1日(周一、二、三) </td>    <td> 4月27日(周六)、4月28日(周日) </td>    <td> 3天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/qingmin/" class="STYLE4">2014清明节</a> </td>    <td> 6月10日 - 12日(周一、二、三) </td>    <td> 6月8日(周六)、6月9日(周日) </td>    <td> 3天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/laodong/" class="STYLE5" >2014五一劳动节</a> </td>    <td>9月19日 - 21日(周四、五、六) </td>    <td>9月22日(周日) </td>    <td>3天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/duanwu/" class="STYLE5" >2014端午节</a> </td>    <td>10月1日 - 7日(周二 ?> 下周一) </td>    <td>9月29日(周日)、10月12日(周六) </td>    <td>7天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/zhongqiu/" class="STYLE5">2014中秋节</a> </td>    <td>10月1日 - 7日(周二 ?> 下周一) </td>    <td>9月29日(周日)、10月12日(周六) </td>    <td>7天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fanjiaanpai.cn/" class="STYLE5">2014国庆节</a> </td>    <td>10月1日 - 7日(周二 ?> 下周一) </td>    <td>9月29日(周日)、10月12日(周六) </td>    <td>7天 </td>  </tr>  </table>
登入後複製



请教下怎么才能控制表格的宽度 我修改也没效果,另外怎么才以让里面的字体不换行?谢谢
图片上传不了,就是每个表格他宽度现在都是一样的,没法修改,我修改了宽度也没效果


回复讨论(解决方案)

<style>	td{word-break: keep-all; white-space:nowrap;}		td.break{ word-wrap: break-word; word-break: normal; white-space: normal }</style><table width="960" height="200" border="1" align="center" bordercolor="#0033CC" style="border-collapse:collapse" >  <tr>    <th height="50" colspan="5" scope="col"><div align="center"><a href="http://www.15fj.com/" class="STYLE1">2013年-2014年国家法定节假日放假安排/通知</a></div></th>  </tr>  <tr>    <td width="123" height="20">节日</td>    <td width="261" height="20" >放假日期</td>    <td width="246" height="20">调休上班日期</td>    <td width="141"  height="20">放假天数</td>    <td width="163" rowspan="10" class="break" >《<a href="http://www.fangjiaanpai.cn/">2014年放假安排时间表</a>》放假安排方案是依据国务院《关于修改全国年节及纪念日放假办法的决定》,参照往年国务院办公厅往年下达的关于部分节假日安排的通知,结合当前工作实际,在坚持科学发展观重要思想指导下做出的。2014年节假日放假安排方案须报请国务院批准方可生效,最终方案将于2013年底予以公布,届时国务院办公厅将以通知的方式下达。以便相关单位及早合理安排节假日旅游、交通运输、生产经营等有关工作,本站现在方案仅供参考!</td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/zhongqiu/" class="STYLE4" >2013中秋</a> </td>    <td >1月1日 - 3日(周二、三、四) </td>    <td>1月5日(周六)、1月6日(周日</td>    <td>3天</td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/guoqing/" class="STYLE4" >2013国庆</a> </td>    <td> 2月9日 - 15日(周六→周五) </td>    <td> 2月16日(周六)、2月17日(周日) </td>    <td> 7天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/yuandan/" class="STYLE4"  >2014元旦</a> </td>    <td> 4月4日 - 6日(周四、五、六) </td>    <td> 4月7日(周日) </td>    <td> 3天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/chunjie/" class="STYLE4" >2014春节</a> </td>    <td> 4月29日 - 5月1日(周一、二、三) </td>    <td> 4月27日(周六)、4月28日(周日) </td>    <td> 3天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/qingmin/" class="STYLE4">2014清明节</a> </td>    <td> 6月10日 - 12日(周一、二、三) </td>    <td> 6月8日(周六)、6月9日(周日) </td>    <td> 3天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/laodong/" class="STYLE5" >2014五一劳动节</a> </td>    <td>9月19日 - 21日(周四、五、六) </td>    <td>9月22日(周日) </td>    <td>3天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/duanwu/" class="STYLE5" >2014端午节</a> </td>    <td>10月1日 - 7日(周二 ?> 下周一) </td>    <td>9月29日(周日)、10月12日(周六) </td>    <td>7天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/zhongqiu/" class="STYLE5">2014中秋节</a> </td>    <td>10月1日 - 7日(周二 ?> 下周一) </td>    <td>9月29日(周日)、10月12日(周六) </td>    <td>7天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fanjiaanpai.cn/" class="STYLE5">2014国庆节</a> </td>    <td>10月1日 - 7日(周二 ?> 下周一) </td>    <td>9月29日(周日)、10月12日(周六) </td>    <td>7天 </td>  </tr>  </table>
登入後複製
登入後複製

<style>	td{word-break: keep-all; white-space:nowrap;}		td.break{ word-wrap: break-word; word-break: normal; white-space: normal }</style><table width="960" height="200" border="1" align="center" bordercolor="#0033CC" style="border-collapse:collapse" >  <tr>    <th height="50" colspan="5" scope="col"><div align="center"><a href="http://www.15fj.com/" class="STYLE1">2013年-2014年国家法定节假日放假安排/通知</a></div></th>  </tr>  <tr>    <td width="123" height="20">节日</td>    <td width="261" height="20" >放假日期</td>    <td width="246" height="20">调休上班日期</td>    <td width="141"  height="20">放假天数</td>    <td width="163" rowspan="10" class="break" >《<a href="http://www.fangjiaanpai.cn/">2014年放假安排时间表</a>》放假安排方案是依据国务院《关于修改全国年节及纪念日放假办法的决定》,参照往年国务院办公厅往年下达的关于部分节假日安排的通知,结合当前工作实际,在坚持科学发展观重要思想指导下做出的。2014年节假日放假安排方案须报请国务院批准方可生效,最终方案将于2013年底予以公布,届时国务院办公厅将以通知的方式下达。以便相关单位及早合理安排节假日旅游、交通运输、生产经营等有关工作,本站现在方案仅供参考!</td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/zhongqiu/" class="STYLE4" >2013中秋</a> </td>    <td >1月1日 - 3日(周二、三、四) </td>    <td>1月5日(周六)、1月6日(周日</td>    <td>3天</td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/guoqing/" class="STYLE4" >2013国庆</a> </td>    <td> 2月9日 - 15日(周六→周五) </td>    <td> 2月16日(周六)、2月17日(周日) </td>    <td> 7天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/yuandan/" class="STYLE4"  >2014元旦</a> </td>    <td> 4月4日 - 6日(周四、五、六) </td>    <td> 4月7日(周日) </td>    <td> 3天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/chunjie/" class="STYLE4" >2014春节</a> </td>    <td> 4月29日 - 5月1日(周一、二、三) </td>    <td> 4月27日(周六)、4月28日(周日) </td>    <td> 3天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/qingmin/" class="STYLE4">2014清明节</a> </td>    <td> 6月10日 - 12日(周一、二、三) </td>    <td> 6月8日(周六)、6月9日(周日) </td>    <td> 3天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/laodong/" class="STYLE5" >2014五一劳动节</a> </td>    <td>9月19日 - 21日(周四、五、六) </td>    <td>9月22日(周日) </td>    <td>3天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/duanwu/" class="STYLE5" >2014端午节</a> </td>    <td>10月1日 - 7日(周二 ?> 下周一) </td>    <td>9月29日(周日)、10月12日(周六) </td>    <td>7天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fangjiaanpai.cn/zhongqiu/" class="STYLE5">2014中秋节</a> </td>    <td>10月1日 - 7日(周二 ?> 下周一) </td>    <td>9月29日(周日)、10月12日(周六) </td>    <td>7天 </td>  </tr>  <tr>    <td height="15"><a href="http://www.fanjiaanpai.cn/" class="STYLE5">2014国庆节</a> </td>    <td>10月1日 - 7日(周二 ?> 下周一) </td>    <td>9月29日(周日)、10月12日(周六) </td>    <td>7天 </td>  </tr>  </table>
登入後複製
登入後複製


但还有个问题,这样的话 不换行是解决了,现在文字都跑其它格子里去了,表格宽度还是没有变,请教下怎么调控表格宽度 谢谢

最后一个格子里的我又需要他自动换行

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
2 週前 By 尊渡假赌尊渡假赌尊渡假赌
倉庫:如何復興隊友
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗? 公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗? Mar 04, 2025 pm 12:32 PM

公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗?

如何使用HTML5表單驗證屬性來驗證用戶輸入? 如何使用HTML5表單驗證屬性來驗證用戶輸入? Mar 17, 2025 pm 12:27 PM

如何使用HTML5表單驗證屬性來驗證用戶輸入?

如何高效地在網頁中為PNG圖片添加描邊效果? 如何高效地在網頁中為PNG圖片添加描邊效果? Mar 04, 2025 pm 02:39 PM

如何高效地在網頁中為PNG圖片添加描邊效果?

HTML5中跨瀏覽器兼容性的最佳實踐是什麼? HTML5中跨瀏覽器兼容性的最佳實踐是什麼? Mar 17, 2025 pm 12:20 PM

HTML5中跨瀏覽器兼容性的最佳實踐是什麼?

&lt; datalist&gt;的目的是什麼。 元素? &lt; datalist&gt;的目的是什麼。 元素? Mar 21, 2025 pm 12:33 PM

&lt; datalist&gt;的目的是什麼。 元素?

我如何使用html5&lt; time&gt; 元素以語義表示日期和時間? 我如何使用html5&lt; time&gt; 元素以語義表示日期和時間? Mar 12, 2025 pm 04:05 PM

我如何使用html5&lt; time&gt; 元素以語義表示日期和時間?

&gt; gt;的目的是什麼 元素? &gt; gt;的目的是什麼 元素? Mar 21, 2025 pm 12:34 PM

&gt; gt;的目的是什麼 元素?

&lt; meter&gt;的目的是什麼。 元素? &lt; meter&gt;的目的是什麼。 元素? Mar 21, 2025 pm 12:35 PM

&lt; meter&gt;的目的是什麼。 元素?

See all articles