【问题标题】:Responsive image and text at same time同时响应图像和文本
【发布时间】:2016-01-21 21:18:09
【问题描述】:

有没有办法在右侧制作文本,同时在左侧缩放图像。当我尝试调整浏览器文本高度时,它会超出。我尝试使用媒体查询来做到这一点,但它不起作用。另外我不想在元素上使用高度。这可能吗?这是jsfiddle:

[http://jsfiddle.net/mbole87/a9zstjzb/1/]

【问题讨论】:

  • 寻求调试帮助的问题必须包含重现它所需的最短代码在问题本身中。 注意 - 请不要滥用代码块来解决这个问题要求.
  • @mbole87 你问什么不清楚。你是指字体大小还是包含文本的框的大小??

标签: html css responsive-design


【解决方案1】:

您可以在 CSS 中使用“vw”值吗?当然,还有一些用于您的图像的 CSS...

.some-class{
    font-size: 2vw
}

【讨论】:

  • 谢谢,但浏览器不支持。
  • 不,但这是您能够提供真正响应式文本的唯一真正方式。缺点是它还取决于视口大小。
【解决方案2】:

您可以做的一件事是向框添加最小和最大高度属性。

min-height: ___;
max-height: ___;
overflow: hidden;

然后添加溢出:隐藏,因此如果你在框中输入太多文本,它会隐藏它以防止它超出..

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2013-07-23
    • 2016-01-12
    • 1970-01-01
    • 2014-01-30
    • 2018-02-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多