2016-11-05 10 views
0

Wordpress用のCustomizrテーマを使用しています.2つの異なるサイズを含むコンテンツブロックが必要です。 (例:「訪問した」というのは大きく、「2016年3月」はもっと小さくなりますが、どちらも同じ行にあるはずです)Wordpress Customizr - 本文のフォントサイズを変更する

これらのサイズは「スパンスタイル」で簡単に設定できますが、私はまた、小さなビューポートでフォントサイズを変更したいと思うし、 "スタイル"を使ってもそれはできません。

だから私は動作するはずというコードを考え出し:

p.infobox-large{ 
 
font-size: 30px; 
 
float: left; 
 
line-height: 35% 
 
} 
 
p.infobox-small{ 
 
    font-size: 17px; 
 
    line-height: 450% 
 
}
<p class="infobox-large">Visited &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;</p><p class="infobox-small">March, 2016</p> 
 

 
<p class="infobox-large">Where &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;</p><p class="infobox-small">Madrid, Toledo, Consuegra, Granada</p> 
 

 
<p class="infobox-large">English? &nbsp; &nbsp; &nbsp; &nbsp;</p><p class="infobox-small">Not much! Brush up on your Spanish!</p> 
 

 
<p class="infobox-large">Thoughts &nbsp; &nbsp; &nbsp;</p><p class="infobox-small">Laid-back atmosphere, friendly people</p>

をしかし、私は私のウェブサイトにそれを置くときに、テキストの全てが同じサイズです。テーマのコーディングと矛盾するものはありますか?または私は何か間違っているのですか?参考のため

は、こちらのページがあります:http://anotherredpin.com/spain/

答えて

-1

あなたのCSSは、このuは

#dslc-module-12 .dslc-text-module-content p.infobox-large{ 
font-size: 30px; 
float: left; 
} 
#dslc-module-12 .dslc-text-module-content p.infobox-small{ 
    font-size: 17px; 
} 

と小型スクリーンデバイスのために

@media only screen and (max-width: 1200px) { 
    #dslc-module-12 .dslc-text-module-content p.infobox-large{ 
     font-size: 20px; 
    } 
    #dslc-module-12 .dslc-text-module-content p.infobox-small{ 
     font-size: 15px; 
    } 
} 

をすることができます動作するはずですコードの下、他のCSSの使用によってoverrightされますあなたが望むように、フォントサイズと行の高さ(px)で再生

+0

完全に働いた!ありがとうございました! –

関連する問題