bootstrap3.0 模态框显示的文字超出怎么办

版本：bootstrap3.3 模态框文字超出

解决方案：

在html中控制自动换行

其实只要在表格控制中添加一句
<div style="word-break:break-all">就搞定了。</div>
其中可能对英文换行可能会分开一个单词问题：解决如下：
语法：

word-break : normal | break-all | keep-all

参数：

normal : 　依照亚洲语言和非亚洲语言的文本规则，允许在字内换行
break-all : 　该行为与亚洲语言的normal相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本
keep-all : 　与所有非亚洲语言的normal相同。对于中文，韩文，日文，不允许字断开。适合包含少量亚洲文本的非亚洲文本

<br>是软回车，就是换行后还是紧接着上一行，没有</br>
<p>是段落标签，由于例如居中、缩进等标签都是以段落为单位的，所以它可比<br>有更多作用，但每次换行都会多空一行，有</p>

除此之外，例如表格、表单、水平线等都是强制换行，就是紧接着的标签前无论有没有换行标签，都强制换行。

参考文章：http://www.cnblogs.com/zjxbetter/articles/1323449.html

时间： 2024-10-07 08:57:56

bootstrap3.0 模态框显示的文字超出怎么办的相关文章

Bootstrap(v3.2.0)模态框(modal)垂直居中

Bootstrap(v3.2.0)模态框(modal)垂直居中方法: 在bootstrap.js文件900行后面添加如下代码,便可以实现垂直居中. that.$element.children().eq(0).css("position", "absolute").css({ "margin":"0px", "top": function () { return (that.$element.height(

Bootstrap.之模态框显示在遮罩层后面

Bootstrap.之模态框显示在遮罩层后面问题描述: 在使用bootstrap模态框,弹出的窗口在遮罩层后面,见图: 解决方案: 保证模态框的代码,所在的上一级(父元素)是body标签,即可.例如: 原文地址:https://www.cnblogs.com/Charles-Yuan/p/11976302.html

bootstrap模态框显示控制

默认模态框弹出后,点击背景蒙层部分弹框会消失,如要解决,需要在模态框属性中加 aria-hidden="true" data-backdrop="static"属性即可:

多行文本，垂直居中显示，文字超出高度显示省略号

最近项目中遇到多行文本,显示不全想打省略号,块状文本垂直居中显示,功能实现如下, html:结构 <div class="questype-rate"> <ul class="clearfix"> <li> <div class="namebox"> <div class="question-name"> <div class="namerow&quo

密码框显示提示文字

<html><head></head><body><div><input type="text" value="密码" onfocus="if(this.value==defaultValue) {this.value='';this.type='password'}" onblur="if(!value) {value=defaultValue; this.type='

bootstrap之模态框

虽然现在开源社区上有各种功能强大的模态JS框库或JS插件,但大都需要依赖jQuery, 对于使用Zepto的移动端来说不太适合,而且很多功能都不需要.其实要实现一个简单的模态对话框,只需几行HTML+css+js代码就能搞定. 首先在html上定义两个div元素,其中外层div表示模态框外面的覆盖层(overlay layer), 内层的div表示模态框 ? 1 2 3 4 5 6 <div id="modal-overlay"> <div class=&

Bootstrap学习笔记-模态框

简介模态框经过了优化,更加灵活,以弹出对话框的形式出现,具有最小和最实用的功能集,参考modal. 用法 HTML结构 div[class=modal[fade]][id] div[class=modal-dialog[modal-lg|modal-md|modal-sm]] div[class=modal-content] div[class=modal-header] h1/h2/h3/h4/h5/h6[class=modal-title] div[class=modal-body] di

前端实例练习 - 模态框

模态框代码储存在Github效果预览初衷:很多人在初学前端的时候都会问,"如何入门前端?"同为在前端学习道路上,奋力追赶的一员,本人对于目前网络上所能看到的 "入门级" 的教材并不太满意.学习一门新知识,实例是尤其重要的.在这里本人整理了目前页面上常见功能实现的具体实例.愿能为大家提供一些帮助.希望能够与大家互相分享,共同进步. 效果预览 HTML 部分  <button id="triggerBtn&quo

BootStrap——模态框

模态框(Modal)是BootStrap中很棒的一个插件.可以去BootStrap菜鸟驿站里面看看. 模态框(Modal)是覆盖在父窗体上的子窗体.通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动.子窗体可提供信息.交互等. 这里记录的是自己手动调用模态框而不会使用自动的,自己手动的可以做很多的处理,如:添加数据,修改数据,显示数据等等. <!DOCTYPE html> <html> <head> <meta charset="