Question

我试图将这个部门放在网站的中心。但它不起作用。我知道如何将分部放在中心？

HTML：

<div id="first">
    <img id="image1" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150"/>
    <img id="image2" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150"/>
    <img id="image3" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150"/>
    <img id="image4" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150"/>
    <img id="image5" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150"/>
    <img id="image6" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150"/>
    <img id="image7" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150"/>
    <img id="image8" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150"/>
    <img id="image9" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150"/>
    <img id="image10"src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150"/>
</div>

CSS：

#first
{
    top:-215px;
    width: 50%;
    height: 220px;
}
#first img 
{
    height: 100px;
    width: 100px;
    float:left;
    margin-right: 5%;
}

的jsfiddle： https://jsfiddle.net/trszrqfx/

Answer 1

我不确切地知道你想要做什么，但我想你想把“分频器”放在中心

#first
{
    width: 50%;
    height: 220px;
    margin:auto; //add this
}

https://jsfiddle.net/trszrqfx/2/

Answer 2

你的意思是这样的？

#first
{
    width: 50%;
    height: 220px;
}
#first img 
{
    height: 100px;
    width: 100px;
    float:left;
    margin-right: 5%
    border-right: 1px solid #000;
    padding-right: 20px;
}

显示分隔符

2 个答案: