Question

我在Wordpress中使用Customizr主题，我想要一个包含两种不同尺寸的内容块。（例如：＆＃34;访问＆＃34;会很大，而＆＃34; 2016年3月和＃34;会更小。两者都应该在同一条线上。）

我可以使用＆＃34; span style＆＃34;轻松设置这些尺寸，但问题是我还想在较小的视口中更改字体大小，并使用＆＃34; style＆＃34;不让我这么做。

所以我想出了应该工作的代码：

＆＃13;

p.infobox-large{
 font-size: 30px; 
 float: left;
 line-height: 35%
}
p.infobox-small{
  font-size: 17px;
  line-height: 450%
}

＆＃13;

<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>

＆＃13;

但是当我把它放到我的网站上时，所有的文字大小相同。与主题编码相矛盾的是什么？或者我做错了什么？

供参考，请访问以下页面：http://anotherredpin.com/spain/

Answer 1

你的css是完全正确的其他css使用下面的代码这应该工作

#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;
    }
}

你可以根据需要使用font-size和line-height（以px为单位）

Wordpress Customizr - 更改正文中的字体大小

1 个答案: