如何在封面图片下方放置文字?(How to put text below the cover image?)
我试图达到以下效果。 看起来像背景的图像放在页面的前60%。 如果图像不成比例,则应保持正确的宽高比。
在此图像之后,其他一些文字会出现
我在上半场取得了成绩
#fullcover{ position: absolute; background-image: url(img); top: 0; left: 0; right: 0; bottom: 0; background-size: cover; background-position: center; max-height: 60%; }
但问题是我的文字现在隐藏在我的图像背后。 我怎么能把它正好放在下面? JsFiddle就在这里 。
对不起,首先不包括这个:我宁愿不使用html,身体100%。
I am trying to achieve the following effect. An image that looks like a background is placed in the top 60% of the page. If the image is unproportional, it should keep correct aspect ratio.
After this image some other text goes.
I achieved the first half with
#fullcover{ position: absolute; background-image: url(img); top: 0; left: 0; right: 0; bottom: 0; background-size: cover; background-position: center; max-height: 60%; }
but the problem is that my text is now hiding behind my image. How can I put it exactly below? JsFiddle is here.
Sorry for not including this in the first place: I would rather not use html, body 100%.