html - 窗口大小减小时框内的文本超出

标签 html css overflow

我有一个网站,其中的 div 有一些文本和背景颜色。

<div class="info-box synopsis">
 Some text
</div>

.synopsis {
    background:#0d101c;
    text-indent:40px;
    opacity:0.6;
    margin-top:20px;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-family: 'Roboto Condensed', sans-serif;
    line-height:25px;
    font-size:1.30;
    text-align:justify;
    border:1px solid #0d101c;
}
.info-box {
    padding:10px;
    color:#d2d2d2;
    font-size:1em;
}

当屏幕全宽时它工作正常。但是,如果我们将屏幕尺寸缩小,div 中的文本就会超过 !请引用我附上的图片。请在这方面帮助我。

网址:Rajsree

widescreen

smaller screen

最佳答案

删除div元素并将类分配给body标签,

<div class="fullscreen-img"></div>

像这样将类分配给正文标签,

<body class="fullscreen-img">

然后通过修改背景属性来更新类的css。

.fullscreen-img {
background: url("2.jpg") no-repeat scroll;

从背景中删除 center 属性。


如果您难以将图像放置在正确的位置,请将图像大小编辑为适当的像素。

关于html - 窗口大小减小时框内的文本超出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21777015/

相关文章:

html - 删除了菜单项,如何使菜单栏扩展以填充空间?

python - BeautifulSoup get_text 不会去除所有标签和 JavaScript

php简单html dom解析img html5属性?

html - 我可以在 Safari 和 Chrome 上禁用 YUI 菜单中的蓝色突出显示吗?

css - 计算 font-size 的继承值

javascript - 带有上一个、暂停和下一个按钮的 JS 文本循环

asp.net - 为什么 CssStyleCollection.Remove() 在这里失败了?

Newton-Raphson 求根方法的 Python OverflowError

html - flex 元素溢出容器

c++ - 在 C++ 中处理巨大的多维数组