2
我在嘗試響應式設計。字體大小在方向更改上變小
font-size
似乎確定,如果推的任何鏈接或重新加載頁面,但得到與方向的變化較小。
也沒有使用ctrl + zoom進行修復。
我裝等
@font-face {
font-family: 'Easy';
src: url('fonts/Easy.eot');
src: url('fonts/Easy.eot?#iefix') format('embedded-opentype'),
url('/fonts/Easy.woff') format('woff'),
url('/fonts/Easy.ttf') format('truetype'),
url('/fonts/Easy.svg#arbat') format('svg');
font-weight: normal;
font-style: normal;}
@media only screen and (min-width: 320px) and (max-width: 479px) and (orientation:portrait) {
.container {
position: relative;
width: 100%;
margin: 0 auto;
height: 480px;
padding: 0;
overflow: hidden; }
.container .columns {
float: left; display: inline; margin-left: 0; margin-right: 12%; }
.row
{ margin-bottom: -10px; }
.container .eight.columns {
width: 300px;
margin-bottom: -12%;
margin-left: -3%;
padding-top: 12%;
}
#stars1, #texttwo, #texttre, #textfour, #textfive, #textsix, #stars2, #texttwotwo, #texttwotre, #texttwofour,#texttwofive, #texttwosix, #stars3, #texttretwo, #texttretre, #texttrefour, #texttrefive, #texttresix, #texttreseven, #texttreeight , #stars4, #textfourtwo, #textfourtre, #textfourfour, #textfourfive, #textfoursix, #textfourseven, #textfoureight, #stars5, #textfivetwo, #textfivetre, #textfivefour, #textfivefive, #textfivesix {
font-family: "Easy";
white-space: pre;
max-width: 320px;
margin-bottom: -10px;
font-size: 2em;
color: rgba(225,207,189,0.5);
position: relative;
text-align:center;
z-index: 5;
opacity:0;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
}
}
有沒有什麼解決辦法嗎?
你有沒有試過看,如果你可以在Firefox的響應式設計視圖(crtl-shift-M)中複製它? – amphetamachine 2014-10-08 14:09:12
您只添加了關於您正在使用的字體系列的css信息 - 與字體大小或屏幕尺寸無關。請參閱[如何創建最小,完整,可驗證的示例](http://stackoverflow.com/help/mcve)上的說明。 – 2014-10-08 14:27:50
我試過Firefox的響應式設計視圖,它顯示了這個問題。我添加了字體大小和屏幕尺寸的部分代碼。希望有所幫助) – svt 2014-10-08 15:12:10