css - 在 480 宽屏幕上观看时,我需要在单词后添加一个 <br>

标签 css class tags break

<分区>


想改进这个问题吗? 通过 editing this post 添加细节并澄清问题.

关闭 8 年前

我需要添加一个 <br>在 480 宽屏幕上观看时,在一个词之后。

例。桌面

<img src="images/phone_icon.png">1-000-000-0000(Int.)
<img src="images/phone_icon.png">1-000-000-0000(US)

我需要添加一个 <br>(Int.) 之后当屏幕达到 480 宽度时 应该转到下一行。

是否有伪类或 css 代码来添加该标记?

提前谢谢你

最佳答案

为每组图像和文本添加一个包装器并使用媒体查询处理它可能是最有意义的。像这样:

http://jsfiddle.net/2uUx4/

更新 HTML:

<span class="wrapper">
    <img src="images/phone_icon.png"/>1-626-389-8668(Int.)
</span>
<span class="wrapper">
    <img src="images/phone_icon.png"/>1-866-933-7368(US)
</span>

CSS:

@media (max-width: 480px) {
    .wrapper{
        display: block;    
    }
}

关于css - 在 480 宽屏幕上观看时,我需要在单词后添加一个 <br>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24705616/

上一篇:html - 无法将 css 应用于表单

下一篇:html - 如何使用 Bootstrap 3 的非整数列宽制作像素完美的网站?

相关文章:

css - 为什么 `border-left` 会影响 CSS 中椭圆的形状?

ios - UIPageViewControllerDelegate 应该属于哪个类

git tag -l 不删除已删除的标签

asp.net - 在 ASP .NET 3.5 Web App 中删除 "noise"单词的最佳方法?

javascript - 如何使用 jQuery 将动画添加到条形图?

javascript - 输入标签的意外标识符

html - 具有 flex 和始终可见标题的 chalice 布局

typescript 类不实现接口(interface)类型

python - 为战斗模拟器生成随机数

html - POST 与 post,GET 与 get