文本超出自动换行
//设置文本自动换行,行内元素数字字母需要设置,块级标签一般会超出自动换行。
div {
word-wrap: break-word; //设置文本自动换行
word-break: normal;
}
//超出盒子设置滚动条,并且自定义滚动条样式,以下滚动条样式最好都设置。
div { //这是外部div
width: 100px;
height: 700px;
overflow: auto; /*当内容超过,出现滚动条*/
}
/* 设置滚动条样式 */
::-webkit-scrollbar {
/*滚动条整体*/
width: 20px;
border-radius: 5px;
}
::-webkit-scrollbar-track {
/*滚动条轨道*/
background: #fff;
border-radius: 10px;
}
::-webkit-scrollbar-thumb {
/*滚动条里面的滑块*/
border-radius: 10px;
background: #333;
}
::-webkit-scrollbar-thumb:hover {
/*滚动条鼠标事件,鼠标放上去出现的事件*/
background: gray;
}
::-webkit-scrollbar-corner {
/*滚动条边角*/
background: #fff;
}
//隐藏浏览器的默认滚动条
在<body>之前加上这条html代码:<body style="overflow:-Scroll;overflow-y:hidden" >
//想显示底部x轴的滚动条
overflow-x: auto;
white-space: nowrap; //文字强制不换行