html 文本 撑满一行,html – 任何阻止特定文本行溢出到下一行的方法?

我目前有一个带有几个文本规则集的div标签,p,h1,h2 ……等等.

我想知道无论如何我可以做到这样,如果文本对于div的宽度变得太长而这些规则中的一个不会进入下一行,而是从div中运行的文本没有被显示在浏览器中?

所以,例如,我的p标签是正常的,如果文本行太长,它将简单地溢出到下一行,与我的h1和h2相同,但我希望我的h3只占用一行而从不占用多个,即使这意味着一些文本在div的边缘被切断.

This is the first header and this will overflow onto the next line when it gets too long.

This is the second header and this will overflow onto the next line when it gets too long..

This is the paragraph and this will overflow onto the next line when it gets too long.

This is the third header and I do not want this to overflow when it gets too long... But it does :(

CSS

#box {

position:absolute;

width:540px;

height:auto;

left:80px;

top:0px;

padding-bottom:20px;

background-color:#000000;

}

#box h1{

font-family:Ebrima;

font-size:22px;

font-weight:normal;

text-decoration:underline;

text-align:center;

margin-bottom:10px;

color:pink;

}

#box h2{

font-family:Ebrima;

font-size:20px;

font-weight:normal;

font-style:italic;

text-align:center;

margin-bottom:15px;

color:lightyellow;

}

#box h3{

font-family:Ebrima;

font-size:14px;

font-weight:bold;

text-align:center;

margin-top:10px;

margin-left:25px;

margin-right:25px;

color:lightgreen;

overflow:hidden;

}

#box p{

font-family:Ebrima;

font-size:16px;

font-weight:lighter;

text-align:justify;

margin-left:25px;

margin-right:25px;

color:lightblue;

}

我试过添加overflow:hidden;到h3规则,这在firefox中有效,但在IE,Opera,Chrome或Safari中没有.

我也试过文字溢出:隐藏;和textoverflow-hidden因为某些原因我认为那些可能有效,但他们没有在任何浏览器中.

如果其中任何一个工作正常或有其他方法我可以做到这一点?

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值