html - 修复 <Pre> 的大小并使其在 html 中可滚动

标签 html css scroll pre

我使用 < Pre > 在 Modal 中显示我的 json 数据。但是

 根据 json 的大小变成了不同的大小。我想修复 
 高度。如果 json 较大,它将滚动显示。 

这是我的模态框。

<div class="modal-content json-modal-body" id="full-width" ng-controller="projectdetailsController">

    <div class="modal-header modal-header-confirm">
        <h4 class="modal-title ng-binding">
            <span class="glyphicon glyphicon-indent-left"></span>{{modalOptions.headerText}}
        </h4>
    </div>

    <div class="modal-body"> 

         <pre ng-bind-html="json | prettifyFilter"></pre>

    </div>

</div>

当 json 为空时。变成这样 enter image description here

我该怎么做?

最佳答案

试试这个:

<style>
 div.scroll {
    width: 100px;
    height: 100px;
    overflow: scroll;
 }
</style>

看看,这是否解决了您的问题。

关于html - 修复 <Pre> 的大小并使其在 html 中可滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27873560/

相关文章:

javascript - JQuery 打印按钮不显示

python - 基本 Django 搜索实现

iOS:随机分页 ScrollView

Javascript 不在同一行输出结果

javascript - 默认值不是?选择选项 Angularjs 中的对象 :null ?

html - 中间有重叠的响应式方形图像

javascript - 如何控制scrolltop javascript函数?

ios - 固定标题在 iPhone/iOS 滚动时跳跃和闪烁

javascript - 在 OpenCart 中组合多个 CSS 或 JS 文件

html - 不用absolute把div放在parent的底部