Jquery 中心“；ul"；具有设置宽度的元素

我想将未排序的列表设置为“背景”。为此，我将其设置为非常宽，以便与打开页面的任何屏幕匹配，包括2560px的宽度。但是我不能完全使用CSS，除非有技巧或其他什么。我愿意走jquery的路。从技术上讲，ul将具有与背景位置相同的效果：顶部居中

我附加了一个带有工作方式的图像，而不是代码（添加的代码）

我使用了内联css，这样我想做的事情就更清楚了

感谢您的任何帮助

是您想要的吗？我认为你说“背景”时解释得不对

CSS

这是你想要的吗？我认为你说“背景”时解释得不对

CSS

---

你想完成这样的事情吗

绝对可以在屏幕中部使用<代码>顶部：<代码> UL> <代码> 50%；代码>只要将

页边距顶部设置为
高度的负一半。例如，如果
高度为
100px
，则需要设置
边距顶部：-50px以及
顶部：50%；位置：绝对位置
以使
完全垂直居中于屏幕中央

如果您事先不知道
的高度，我添加了一些jQuery来确定高度并相应地调整边距顶部。您可以在JSFIDLE上更改
容器的高度，以查看无论容器的高度如何，
都将垂直居中

您希望完成这样的任务吗

绝对可以在屏幕中部使用<代码>顶部：<代码> UL> <代码> 50%；代码>只要将
页边距顶部设置为
高度的负一半。例如，如果
高度为
100px
，则需要设置
边距顶部：-50px以及
顶部：50%；位置：绝对位置
以使
完全垂直居中于屏幕中央

如果您事先不知道
的高度，我添加了一些jQuery来确定高度并相应地调整边距顶部。您可以在JSFIDLE上更改
容器的高度，以查看无论容器的高度如何，
都将垂直居中

仅供参考，解决方案显示在屏幕上：块内联。：）感谢您的所有帮助
仅供参考，解决方案显示在屏幕上：block inline.）感谢您的帮助
您应该包括代码。
是否有设置的高度或
的内容/高度是动态的？ul也有设置的高度。宽度也设置好了。你应该包括代码。
有设置的高度还是
的内容/高度是动态的？ul也有设置的高度。宽度也设定好了。是的，但我不想要任何包装。我需要的是保持原样，你什么意思？这样他们就可以在一起了？是的，ul上的内容就像背景一样，我不需要任何包装。只是想让ul中的任何东西随着屏幕大小的调整而居中移动。实际上它很接近，但我需要一/二/三，例如，随着屏幕大小的调整，从屏幕向左移动。想象ul元素是背景，背景位置是中心；这就是我想要的效果是的，但我不想要任何包装。我需要的是保持原样，你什么意思？这样他们就可以在一起了？是的，ul上的内容就像背景一样，我不需要任何包装。只是想让ul中的任何东西随着屏幕大小的调整而居中移动。实际上它很接近，但我需要一/二/三，例如，随着屏幕大小的调整，从屏幕向左移动。想象ul元素是背景，背景位置是中心；这就是我想要的效果是的，类似于下面的计算机艺术。我需要li元素也向左移动，我不希望调整大小只发生在右边，我需要它从两边均匀地发生。所以。。。您希望
项也水平居中吗？我将
text align:center
添加到容器
中以实现这一点：不确定它是否有效。很可能我所要求的是不可能的。检查我贴在帖子上的图片。你可以看到我在第二个版本中调整了屏幕的大小，但是UL仍然保持两侧居中。我想我是通过绝对定位来计算出来的，左：50%，左：1280px；是的，类似于下面的计算机艺术。我需要li元素也向左移动，我不希望调整大小只发生在右边，我需要它从两边均匀地发生。所以。。。您希望
项也水平居中吗？我将
text align:center
添加到容器
中以实现这一点：不确定它是否有效。很可能我所要求的是不可能的。检查我贴在帖子上的图片。你可以看到我在第二个版本中调整了屏幕的大小，但是UL仍然保持两侧居中。我想我是通过绝对定位来计算出来的，左：50%，左：1280px；
<div style="background-color:black; width:100%; overflow:hidden; height:302px; text-align:center; position:relative">
<ul style="padding:0px; margin:0px; text-align:center; width:2560px; height:100%; margin:0 auto 0; position:relative;">
    <li class="image"></li><li class="image"></li><li class="image"></li><li class="image"></li><li class="image"></li><li class="image">

</ul>
</div>

ul{
    list-style-type: none;
    margin: 0;
    position: relative;
    text-align: center;
    width: 100%;
    background:#FF0000;
}


ul li {
    display: inline-block;
    height: 65px;
    overflow: hidden;
    padding: 0;
    background:#0000FF;
    line-height:65px;
    color:#FFF;
    padding:0 5px;
}