[英]Wraping text inside a container
I have a container which I write text inside; 我有一个可以在其中写文本的容器; the code is as follows: 代码如下:
#webdd {
overflow: scroll;
width: 100%;
max-width: 100%;
max-height: 50%;
margin-top: 30%;
word-wrap: break-word;
text-align: center;
display: block;
}
#headerw {
font-size: 16px;
opacity: 0.9;
font-family: globerb;
font-weight: bold;
margin-bottom: 0px;
color: #333;
z-index: 9;
}
#descw {
margin-left: 30px;
margin-right: 30px;
font-size: 13px;
opacity: 0.6;
font-family: globerb;
font-weight: normal;
margin-top: 0px;
color: #333;
text-shadow: none;
text-align: justify;
z-index: 9;
}
The problem is that the page is specifically for mobiles, and when someone has a small height the text goes into a scroll(which doesn't appear on mobiles), I want something that can make text smaller, or.. wrap it in some manner. 问题在于该页面专门用于移动设备,并且当某人的身高较小时,文本会进入滚动状态(在移动设备上不会出现),我想要一些可以使文本变小或..将其包裹起来的东西方式。 #webdd is my main container, the others headerw is the header and descw is the description. #webdd是我的主容器,其他headerw是标题,而descw是描述。
Any ideas? 有任何想法吗?
Use media queries that will change the size of the text according to the height of the container. 使用媒体查询 ,该查询将根据容器的高度更改文本的大小。
@media screen and (max-width: 995px) , screen and (max-height: 700px) {
font-size:1.25em;
}
And other such combinations of the screens sizes that you are targetting to support. 以及您希望支持的其他此类屏幕尺寸组合。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.