参考及举荐:前端优良实际不齐全指南
1:右边定宽(250px),左边宽度自适应
flex:
.g-app-wrapper { display: flex; min-width: 1200px;}.g-sidebar { flex-basis: 250px; margin-right: 10px;}.g-main { flex-grow: 1;}
float:
.g-app-wrapper{ width:100%;}.g-app-wrapper.clearfix:after { content: ""; display: block; clear: both;}.g-sidebar { width: 250px; float:left;}.g-main { margin-left: 250px;}
2:页面中可适当增加不可选中内容,比方按钮等
.btn{ -webkit-user-select: none; /* Safari */ -ms-user-select: none; /* IE 10 and IE 11 */ user-select: none; /* Standard syntax */}
3:鼠标应用状况上来除元素focus,键盘状况下保留focus
input:focus { outline: 1px solid red;}input:focus:not(:focus-visible) { outline: none;}