如何设置与容器字体大小相同的图像大小

时间:2018-02-07 15:19:49

标签: html css svg

我有这个HTML代码:

<p>text <span class="icon svgicon"><img src="img.svg" /></span></p>
<p>text <span class="icon svgicon"><svg>...</svg></span></p>

让我们说段落和跨度的字体大小为16px。是否可以使用CSS使图像具有相同的高度(16px)?

我想以某种方式使图像从span的字体大小继承高度,所以我不需要为我放置它的每个地方自定义它。

这应该是一些svgicons。

最后的办法是让JS解析所有图标,查看holder字体大小并设置高度。

感谢。

2 个答案:

答案 0 :(得分:2)

我相信你可以通过设置相对于字体高度的图像高度并将图像宽度设置为自动来完成它:

.svgicon img, .svgicon svg {
  height: 1em;
  width: auto;
}

p, span {
  font-size: 16px;
}
<p>text <span class="icon svgicon"><img class="custom" src="img.jpeg" /></span></p>
<p>text <span class="icon svgicon"><svg>...</svg></span></p>

答案 1 :(得分:1)

您可以为图片指定private boolean started = false; private Handler handler = new Handler(); private void initializeAdMob() { mRewardedVideoAd = MobileAds.getRewardedVideoAdInstance(this); mRewardedVideoAd.setRewardedVideoAdListener(this); loadRewardedVideoAd(); } private void loadRewardedVideoAd() { if (!mRewardedVideoAd.isLoaded()) { mRewardedVideoAd.loadAd(getString(R.string.id_block_activity), new AdRequest.Builder().build()); } } private void showRewardedVideoAd() { if (BaseInteractor.isNetworkAvailable(this)) { showProgressBar(true); start(); } } private Runnable runnable = new Runnable() { @Override public void run() { if (mRewardedVideoAd.isLoaded()) { mRewardedVideoAd.show(); }else{ loadRewardedVideoAd(); } if (started) { start(); } } }; public void stop() { started = false; handler.removeCallbacks(runnable); } public void start() { started = true; handler.postDelayed(runnable, 2000); } 的高度,该高度将相对于父字体大小。

@Override
public void onRewardedVideoAdOpened() {
    showProgressBar(false);
    stop();
}