系統圈紅區域要固定在該位置，不隨滾動而變動位置。且 其他模組公用這個區域樣式風格。
遇到的問題：
採用position:fixed固定在頭部，fixed是相當於瀏覽器定位，若設寬度為100%，則為整個螢幕寬度，這裡螢幕寬度為1920px，我們可以看到右側按鈕組值露出一點點，大部分被蓋住。
1、紅色區域父元素 寬度正常，圖上是1600px, 定義的樣式是 width:100%，計算得到。.
紅色區域 設width:inherit，繼承不到
2、紅色區域 設 width: calc(100% - 240px)
由於左側面板可伸縮，伸縮後顯示異常
3、紅色區域 設 position:fixed 配合 top right:0 會最左側異常。
4、紅色區域 設width:auto, max-width:100%，都不行
不想通過操作dom就更改樣式，然後苦思
將控制左側伸縮的狀態拿到，存入vuex中，頁面獲取vux中的狀態值，動態給樣式賦值
效果不是很理想 因為要計算樣式 有點卡頓
toggle_collapsed:
false
,//左側選單展開;
[set_toggle_collapsed]:
(state, toggle_collapsed)
=>
,togglecollapsedasyn
(, toggle_collapsed)
,export
const
toggle_collapsed
=(state)
=>
//左導航摺疊收起
togglecollapsed()
,...
mapstate([
'toggle_collapsed'])
,:class
="toggle_collapsed?'w100':'wth'"
.wth
.w100
頁面頭部和底部固定
說明 設定body的padding屬性padding top 16px padding bottom 16px，使頁面上下留有16px的空白。然後設定 header和 footer的絕對位置和高度。設定 content的 overflow auto。試著改變這幾個引數，一用就明白 header fo...
CSS 實現頭部 頁尾滾動和固定
在一般的 中都會有頭部和頁尾。頭部會一直固定在最上面位置。頁尾呢，當頁面內容超出一屏時，頁尾在內容最後，當不足一屏時，在頁面最下面。實現方式有很多。這裡使用的是 position sticky sticky 粘性定位。是css新增的乙個position屬性。為什麼說是粘性定位，從適用場景來看 一開始...
中間滑動 頭部底部固定 選擇合適的自由式頭部位置
許多游泳者 以及一些教練 認為每個游泳者在自由式時都應該直視泳池底部，以改善他們的身體姿勢。這是真的嗎？讓我們來看看一些游泳運動員的水下。泳池明星 首先，我們看一下奧運會金牌得主麗貝卡 阿德靈頓，她向我們展示了乙個中間的頭部位置，看著她前方1 2公尺處的游泳池底部 正如你所看到的，麗貝卡的身體在水中...