CSS隐藏滚动条(如果不需要)

HTML CSS

理查德Tom

2020-03-19

我试图弄清楚如何隐藏overflow-y:scroll;不需要的东西。我的意思是说我正在建立一个网站,并且有一个主要区域将显示帖子,并且如果内容未超过当前宽度,我想隐藏滚动条。

另外,我的第二个问题。我要这样做,以便当帖子超过当前宽度时,宽度将自动增加,并且内容不会开箱即用。

有人知道如何执行此操作吗?

帖子区域:

.content {
    height: 600px;
    border-left: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    font-size: 15px;
    text-align: justify;
    line-height: 19px;
    overflow-y:scroll;
}

主网站容器:

.container {
    margin: 0 auto;
    width: 757px;
    margin-top: 30px;
    text-align: center;
}

第2273篇《CSS隐藏滚动条(如果不需要)》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

6个回答
TomJinJin 2020.03.19

.container {overflow:auto;}将解决问题。如果要控制特定方向,则应为该特定轴设置自动。自动曝光

.container {overflow-y:auto;} .container {overflow-x:hidden;}

上面的代码将隐藏x轴上的所有溢出,并在需要时在y轴上生成滚动条。但是,必须确保所包含的默认高度小于容器高度;否则,滚动条将不会被隐藏。

TomGO小小 2020.03.19

溢出-y:自动;

将overflow-y属性设置为auto,如果未继承,则将其全部删除。

阿飞泡芙 2020.03.19
.selected-elementClass{
    overflow-y:auto;
}
番长十三 2020.03.19

您可以同时使用.content和.container来溢出:auto。意思是如果它的文本被超过,则自动滚动将进入x轴和y轴。(不需要给分离的x轴和y轴通常给出溢出:自动)

.content {overflow:auto;}

JinJin斯丁 2020.03.19

您可以使用 overflow:auto;

您也可以使用overflow-xoverflow-y属性分别控制x轴或y轴

例:

.content {overflow:auto;}
.content {overflow-y:auto;}
.content {overflow-x:auto;}
Itachi猿 2020.03.19

overflow-y属性设置auto,或者如果不继承该属性,则将其完全删除。

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android