gpt4 book ai didi

twitter-bootstrap - 如何为弹出框添加页脚并使内容可滚动?使用 Twitter Bootstrap 3

转载 作者:行者123 更新时间:2023-12-04 17:09:48 25 4
gpt4 key购买 nike

这是图像(我必须做的)

enter image description here

如何为弹出框添加页脚并使内容可滚动?使用 Twitter Bootstrap 3

最佳答案

要创建带有页脚的弹出框,您必须更改弹出框 template并添加一些 CSS 来设置该页脚的样式。在这里,我还在页脚中放置了一个按钮,正如您在绘图中包含的那样,但您必须弄清楚自己想用它做什么。

<div class="popover">
<div class="arrow"></div>
<h3 class="popover-title"></h3>
<div class="popover-content"></div>
<div class="popover-footer">
<button type="button" class="btn btn-default">Button</button>
</div>
</div>

$("[rel=details]").popover({
trigger : 'click',
placement : 'bottom',
content : 'Lorem ipsum dolor ...',
template: '<div class="popover"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div><div class="popover-footer"><button type="button" class="btn btn-default">Button</button></div></div>'
});

样式化页脚:

.popover-footer {
margin: 0;
padding: 8px 14px;
font-size: 14px;
font-weight: 400;
line-height: 18px;
background-color: #F7F7F7;
border-bottom: 1px solid #EBEBEB;
border-radius: 5px 5px 0 0;
}

使弹出内容可滚动 :

.popover-content {
overflow-y : scroll;
height: 200px;
}

见演示 -> http://jsfiddle.net/3x4yD/

enter image description here

关于twitter-bootstrap - 如何为弹出框添加页脚并使内容可滚动?使用 Twitter Bootstrap 3,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22107391/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com