文本响应下面的文本

我该怎么做我的文本响应。例如在桌面上文本响应下面的文本

-------------------------------- 
    12 0 12 15    | 
           | 
           | 
           | 
--------------------------------

而且我想在移动设备去下面，如果字体大小是大

------ 
    12 | 
    0 | 
    12 | 
    15 |

现在我的文字是不是responsive..my数字是互相。

这里是我使用的代码：

.hasCountdown { 
    text-shadow: transparent 0px 1px 1px; 
    overflow: hidden; 
    padding: 30px; 
    /*cursor:pointer;*/ 
} 

.countdown_rtl { 
    direction: rtl; 
} 
.countdown_holding span { 
    background-color: #ccc; 
} 
.countdown_row { 
    clear: both; 
    width: 100%; 
    padding: 3px 2px; 
    text-align: center; 
} 


.countdown_show4 .countdown_section { 
    width: 24.5%; 
} 


.countdown_section { 
    display: block; 
    float: left; 

    text-align: center; 
    line-height: 200%; 
    margin:3px 0; 
    font-family:'halvetica_light'; 
} 
.countdown_amount { 
    font-size: 450%; 
} 


.countdown_amount_red 
{ 
    color:red; 
}

来源

2016-09-29 Aste1959

你正在引导吗？ –

检查了这一点https://stackoverflow.com/questions/39761791/bootstrap-responsive-table-within-displaytable/39761928#39761928 – SAM

没有显示HTML，所有你会得到的是猜测。 –

你可以尝试简单地增加以下（由于您没有提供测试HTML）

html{ 
    font-size: 2vw; 
} 

h1{ 
    font-size: 1em; /*Change h1 or size to fit requirements */ 
}

来源

2016-09-29 08:07:43

在this

看看

这是引导响应式设计。只需阅读链接网格系统，您就可以使文本响应。

来源

2016-09-29 08:26:31 Mahan

不幸的是，使用上述设置，您的字体永远不会响应，因为您没有考虑设备/窗口的大小。你的方法（或至少是你把它放下来的方式）将字体作为使整个事物响应的元素。我强烈建议开始使用移动优先方法，并且Luke Wroblewski explained it quite well back in '09

一旦你了解了这一点，你就会意识到你想要实现响应式排版。为了实现这一点，你有不同的解决方案，如果你想知道哪一个最好，而且当你开始增加更多复杂性时不会中断，那么可能需要更多的阅读。

下面一些非常快速的解释，并为您的阅读快感一些参考（至少为起点），当然，所有这些解决方案使用媒体查询，所以一定要知道那是什么太：

使用%或em为字体大小的措施，这是您寻找的最基本和最直接的解决方案。海事组织从长远来看有点难以维持，但它可以用于简单的小部件/组件（How to make your typography responsive）。
使用rems为单位的大小：这是值得研究的，它可能需要一点它背后的基本概念（Responsive typography with REMs: How to build a scalable typographic foundation in three steps）
使用vh或vw为单位大小的理解，即视高和视宽，分别。（Viewport Sized Typography）

您可以变得富有创意，并结合使用这些方法来实现最适合您的解决方案。

如果您有兴趣进一步了解网页排版，您还可以考虑modular scale and vertical rhythm，但那是另一回事。

我希望这会帮助您解决您的问题并选择正确的解决方案。

来源

2016-09-29 09:36:16

文本响应下面的文本

回答

相关问题