如何使用jQuery和CSS将HTML元素居中？

我想在我的html页面中集中一些html元素，例如标签。我想通过使用jQuery和CSS来实现这一点。不幸的是，我不熟悉jQuery

我只是需要你们的帮助

---

多谢各位

试试这个简单的功能：

jQuery.fn.center = function () {
    this.css("position","absolute");
    this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
    this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
    return this;
}

//Use the above function as:
$(element).center();

---

演示文稿不是jQuery的任务

CSS:

---

我同意最好的方法是通过纯css，但这是一种非常暴力的方法

HTML

<div id="centerme">content</div>

jQuery

$(window).onLoad(this.resize);
$(window).resize(this.resize);

resize = function() {
  var center = ($(window).width/2) - ($('#centerme').width/2);
  $('.centerme').css('left', center+'px');
} 

查看此演示

jQuery

---

你需要

CSS

，而不是

jQuery

。如果不发布HTMLOk，就不可能提供帮助。那么让我更新我的问题。等一下，为什么要否决投票？我只是问一个问题，寻找答案。如果我的问题不符合你的要求，比如放“HTML”，请保持原样。我真的很感激这三个人给了我这些答案。这对我有很大帮助。非常感谢。谢谢你的所有答案。好的，让我试试这个。很好，但是你为什么要添加2？容器和元素之间的差异空间的一半，以获得屏幕的中心，例如（800-400）/2+100如果调整窗口的大小，这将无法适应。。也可能在加载元素之前运行…这也很有趣。酷的纯JQuery。谢谢。再次检查我的更新答案，现在您只需要调用函数并传递元素。这就是全部。调整大小也可以。你有这个更新的演示吗？我会很感激的。是的，这里。。。我的回答也是：）

#centerme {
  position: absolute;
}

$(window).onLoad(this.resize);
$(window).resize(this.resize);

resize = function() {
  var center = ($(window).width/2) - ($('#centerme').width/2);
  $('.centerme').css('left', center+'px');
} 

$(document).ready(function() {
    verCenter('#red');
    verCenter('#blue');
    
    $(window).resize(function(){
        verCenter('#red');
        verCenter('#blue');
    });
});

function verCenter(element){
    var ver_top = ($(window).height() - $(element).height()) / 2;
    $(element).css( "margin-top", ver_top+'px' );
}