繁体   English   中英

我想要全部 <div class=“rectangle”> 标记中心的边框

[英]I want set all <div class=“rectangle”> tag borders in a center

 _______________________________________________
|                                               |
|    Image                                      |
|                                               |
|_______________________________________________|

我想设置一个上面的矩形位于我创建的页面的中心,使用div标签作为代码

.rectangle
{
     width: 73.3%;
     margin:0 50 0 0;         
     border-top:1px solid #46464f;
     border-bottom:1px solid #282832;
     border-left:1px solid #282832;
     border-right:1px solid #282832;
     border-bottom-width:medium;
     border-left-width:medium;
     border-right-width:medium;
     border-top-width:medium;
}

我设置<div class="rectangle" align="center">此代码不起作用

尝试这个:

HTML:

<div align="center">
     <img src="http://fin6.com/wp-content/uploads/2013/07/fb81531cc9cf1512dce7f0e5f36e40fe.jpg" alt="nature"/>
</div>

CSS:

div{
     width: 300px;
     background:red;
     margin:0 auto;
}

img{
     width:150px;
     margin:0 auto;
}

这是一个DEMO

UPDATE

根据您更新的问题,使用margin:0 auto; 以中心为中心。

.rectangle
{
     width: 73.3%;
     margin:0 auto;
     border-top:1px solid #46464f;
     border-bottom:1px solid #282832;
     border-left:1px solid #282832;
     border-right:1px solid #282832;
     border-bottom-width:medium;
     border-left-width:medium;
     border-right-width:medium;
     border-top-width:medium;
}

更新了DEMO

HTML:

<div class="setCenter">Content inside a div tag</div>

CSS:

body {
    width: 100%;
    height: 100%;
    margin:auto;
}

.setCenter {
    margin:auto;
    width:90%;
    height:auto;
    border:1px solid #000;
    color:Green;
}

这是DEMO

试试这个CSS代码:

.rectangle
{
    width: 73.3%; margin:0 50 0 0; 
    border-top:1px solid #46464f; 
    border-bottom:1px solid #282832; 
    border-left:1px solid #282832; 
    border-right:1px solid #282832; 
    border-bottom-width:medium; 
    border-left-width:medium; 
    border-right-width:medium; 
    border-top-width:medium;   
    text-align:center;
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM