用法

width: calc(100% – 100px);

超好用！！特別做rwd真的是神啊。

還沒有測試但是先留資料

https://blog.csdn.net/qq_2842405070/article/details/70238829

要隱藏滾動條主要是針對ie…因為內捲軸的滾動條如果不隱藏，版面上就要留一個捲軸寬度，會搞的很麻煩….

等其他瀏覽器都處理完再來測試

參考文章：HTML table 表格 thead 表頭固定，tbody 滾動

css解法可用，以下是改良，他原本用 > 主要是避免表格內又包表格。但我需要用捲軸的通常不會再包表格，所以可以直接用空格就好。

thead tr{
display: table;
width: 100%;
table-layout: fixed;
}
tbody{
display: block;
height: 271px;
overflow-y: scroll;
}
tbody tr{
display: table;
width: 100%;
table-layout: fixed;}

然後table-layout的說明看這篇：善用 CSS 中的 table-layout 屬性加快 Table 的顯示速度

裡面提到
「CSS 的 table-layout 屬性有兩個可以設定的值：
automatic 表格的總寬度決定於每一個儲存格(Cell)的最大值。( 此為預設值 )
fixed 表格的總寬度決定於表格 width 屬性的定義，以及各欄位(Column) width 屬性的定義」

簡單來說預設值 automatic  要整個表格讀完，瀏覽器才能確認總寬度。
fixed 代表如果你有定義寬，那就直接用定義的寬度。

所以後者顯示速度會比較快。這個有沒有加不影響上述css把表格變成有捲軸。但可以加快網頁成像的速度。

然後讓表格底下有捲軸而且正常顯示的關鍵是要針對tr下 display: table;跟width: 100%;

感覺應該是把tr模擬成表格

總之真的是蠻神奇的設定，可以用就對了。

實做技巧參考這篇

重點摘要：

1. html內radio btn對應的要加上label，裡面可以加入span比較好做後續設定
2. 用這段隱藏原本的樣式（單選type就改radio）
   input[type="checkbox"] {
       display:none;
   }
3. 用這段設定新樣式（未選擇），搭配after跟before就可以做到替換框框的效果。
   input[type="checkbox"] + label span
4. 用這段設定已選擇時的樣式
   input[type="checkbox"]:checked + label span

然後第一次看到+，使用上他就是可以選擇他第一個接觸那個元件。所以找了一下現在css到底有哪些選擇器，css選擇器可以參考這篇

然後我終於搞清楚 > 是什麼意思了。簡單來說 .aaa > ul  跟 .aaa ul 的差異是：

後者只要被 .aaa 包的底下所有 ul 都套用。 前者則是只有第一層。如果第一層ul又包了一層ul，這層就不會被套用。