您好,我正在使用一个 WP 主题来使内容居中,我必须编辑 padding-left,因为我们不知道内容区域的宽度,因为它会根据屏幕分辨率动态变化。
问题是由于不同的浏览器有不同的滚动宽度,有时没有滚动是很难把一个完美的中心位置从“padding-left”和媒体查询计算出来的。
我知道不同的方法,例如 margin: 0 auto、绝对位置或内联 block ,这些方法在其他情况下总是有效。
但是此时我需要类似 Javascript 的东西来计算屏幕分辨率和屏幕中的内容,以便填充可以动态变化到完美的中心。
网站链接为:http://www.fanonfire.com/magazine/
现在不居中,但您可以检查我们用来居中网站的是:
.content_area {padding: 10px 0 0px 107px;}
使用不同的 media_queries 更改最后一个数字。但这不会产生真正的中心位置,而且过程非常缓慢。所以我不知道是否可以使用 Javascript 执行此操作并根据屏幕生成自动填充。
谢谢!
编辑:我试过这个但没有运气(谢谢 ProllyGeek)
var main_width=parseInt($("#main").width())//获取主要宽度
var content_width=parseInt($(".content_area").width())//获取内容区域宽度
var my_padding=((main_width-content_width )/2).toString()
$(".content_area").css("padding-left",my_padding+"px")//给想要的元素设置padding
最佳答案
我建议您熟悉以下 Material :
关于javascript - 动态内容自动中心,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20175930/