我正在设置一个使用Avada主题的Wordpress图片库,我希望能够增加图片库缩略图的大小(例如,200%或300%),并将它们垂直居中。
您可以在下面的图像中看到手册缩略图的问题:

下面是融合图库图像div和手册div的相关元素。
<div class="fusion-gallery-image"><a href="http://bigidearesults.com/sandbox/wp-content/uploads/2018/03/brochure-saguaro-ranch-brochure-2.jpg" class="fusion-lightbox" data-rel="iLightbox[728c57306ad178f5910]" data-title="brochure-saguaro-ranch-brochure-2" title="brochure-saguaro-ranch-brochure-2" data-caption=""><img src="http://bigidearesults.com/sandbox/wp-content/uploads/2018/03/brochure-saguaro-ranch-brochure-2-400x201.jpg" alt="" title="brochure-saguaro-ranch-brochure-2" aria-label="brochure-saguaro-ranch-brochure-2" class="img-responsive wp-image-11546" srcset="http://bigidearesults.com/sandbox/wp-content/uploads/2018/03/brochure-saguaro-ranch-brochure-2-200x100.jpg 200w, http://bigidearesults.com/sandbox/wp-content/uploads/2018/03/brochure-saguaro-ranch-brochure-2-400x201.jpg 400w, http://bigidearesults.com/sandbox/wp-content/uploads/2018/03/brochure-saguaro-ranch-brochure-2-600x301.jpg 600w, http://bigidearesults.com/sandbox/wp-content/uploads/2018/03/brochure-saguaro-ranch-brochure-2-800x401.jpg 800w, http://bigidearesults.com/sandbox/wp-content/uploads/2018/03/brochure-saguaro-ranch-brochure-2-1200x602.jpg 1200w, http://bigidearesults.com/sandbox/wp-content/uploads/2018/03/brochure-saguaro-ranch-brochure-2.jpg 1597w" sizes="(min-width: 2200px) 100vw, (min-width: 824px) 363px, (min-width: 732px) 545px, (min-width: 640px) 732px, "></a></div>
请让我知道如何增加这些画廊图像的大小,并在融合画廊图像div中垂直居中。
谢谢你的帮助。
发布于 2018-03-27 05:45:25
理想情况下,您应该有一个足够大/适合div的一般大小的图像,这样您就不必增加大小,而是只需调整它即可。
例如,图书图像有100%的宽度,但垂直方向太短。一旦你有了它,就可以使用flexbox在垂直和水平方向居中。
.fusion-gallery-image {
display: flex;
justify-content: center;
align-items: center;
}https://stackoverflow.com/questions/49500432
复制相似问题