0
body
{
background: rgb(111,111,111);
}
#Banner
{
width: 100%; /*1200px*/
height: 800px;
background: url("http://www.firstdayfwb.com/images/header.jpg") no-repeat 55%;
background-size: contain;
}
#Mission
{
padding-top: 750px;
width: 50%;
margin-left: auto;
margin-right: auto;
font-size: 250%;
font-weight: bold;
text-align: center;
}
<body>
<div id="Menu">
</div>
<div id="Banner">
<h1 id="Mission">Creating a Church Unchurched People Love to Attend</h1>
</div>
</body>
我試圖讓H1我的字體大小(ID任務)來響應,並改變它的大小基於它的容器的大小。我嘗試了很多東西,改變百分比是我最接近的;但是,它仍然不像我想要的那樣工作。
有關如何將字體大小修改爲基於容器大小(當瀏覽器窗口被調整大小時)調整字體大小的任何想法?
這對我來說好嗎?但是,如果您需要更多:http://simplefocus.com/flowtype/,也許這? – sinisake 2014-10-03 15:54:36
http://stackoverflow.com/q/15649244/2887133 – DaniP 2014-10-03 15:55:48
這個答案可能有所幫助:http://stackoverflow.com/questions/15574823/font-size-relative-to-container 一個純粹的CSS解決方案可以使用多媒體查詢更改字體大小或使用vh和vw單位:http://css-tricks.com/viewport-sized-typography/ – ncardeli 2014-10-03 16:02:22