-1

このウェブサイトhttp://techtunes.com.bdのようなホームページのコンテンツに枠を付ける方法を教えてください。(これは私のサイトです。http://techjagot.com )

body {
    text-align: left;
    margin: 0;
    padding: 30px 0;
    color:#666;
    line-height:1.5em;
    background:#f5f5f5;
    font-size:9pt;
    font-family:arial,helvetica,sans-serif;
    }

#outer-wrap {
    width:100%;
    max-width:960px;
    margin:0 auto;
    background:#fff;
    padding:40px;
    position:relative;
    border:1px solid #e5e5e5;
    z-index:1;
    }

#header {
    clear: both;
    margin: 0 auto;
    padding: 0;
    max-width:100%;
    }

#head-content {
    margin: 0 auto 20px;
    padding: 0;
    max-width:100%;
    }

#sitetitle, 
#logo {
    max-width:100%;
    margin:0;
    padding:0;
    text-align:left;
    }

#logo img {
    max-width:100%;
    height:auto;
    }

#sitetitle .title {
    padding:0;
    margin:0;
    letter-spacing:-1px;
    line-height:1.2em;
    font-size:24px;
    display:block;
    }

#sitetitle .title a {
    color:#000;
    }

#sitetitle .description {
    padding: 0;
    margin:0;
    font-size:9pt;
    display:block;
    }

#wrap {
    max-width:100%;
    background:#fff;
    clear: both;
    margin: 0 auto;
    padding:0;
    }

.limit {
    max-width:100%;
    margin: 0 auto;
    }

#page {
    padding:30px 0;
    clear: both;
    margin: 0 auto;
    background:#fff;
    }

#contentleft {
    width: 65.625%;
    float:left;
    padding:0;
    margin: 0;
    position:relative;
    }

#content {
    width: 100%;
    float:none;
    padding:0;
    margin: 0;

    }

#sidebar-narrow {
    width: 20.635%;
    float:left;
    padding:0;
    margin: 0;
    }

#contentright {
    width: 31.25%;  
    float:right;    
    padding:0;  
    margin: 0;
    }

#sidebar {
    width: 100%;    
    float:none; 
    display:block;
    overflow:hidden;
    }

#sidebar-bottom {
    width: 100%;
    clear:both;
    display: block;
    overflow:hidden;
    padding:0;
    }

#sidebar-bottom-left {
    width:53.33%;
    float:left;
    padding:0;
    margin:0;
    overflow:hidden;
    }

#sidebar-bottom-right {
    width:40%;
    float:right;
    padding:0;
    margin:0;
    overflow:hidden;
    }

#footer {
    clear: both;
    margin: 0 auto;
    padding: 20px 0 0;
    font-size:8pt;
    text-align:center;
    border-top:1px dotted #ddd;
    }

.footurl {
    margin-bottom: 10px;
    }

.clearfix:after,
blockquote:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
    }

.clearfix,
blockquote {
    display: inline-block;
    }

/* Hides from IE-mac \*/
* html .clearfix,
* html blockquote {
    height: 1%;
    }
.clearfix,
blockquote {
    display: block;
    }
/* End hide from IE-mac */

ここにいくつかのスタイル シート コードを示します。これ以上のコードは必要ありません。

4

2 に答える 2

1

私はあなたのHtmlテイクでそれを手にid #page入れ、このcssをこれに入れましたid

#page{
   box-shadow: 0 0 5px 2px #AAA;
   -moz-box-shadow: 0 0 5px 2px #AAA;
    -webkit-box-shadow: 0 0 5px 2px #AAA;
}
于 2013-05-04T04:38:19.307 に答える
0

ボックスシャドウを探していると思います

これを試して：-

    box-shadow: 0 0 5px 2px #AAA;
   -moz-box-shadow: 0 0 5px 2px #AAA;
    -webkit-box-shadow: 0 0 5px 2px #AAA;

Box-shadow を表示したい場所にこれをコンテンツ クラスに追加します。

元：-

#content {
width: 100%;
float:none;
padding:0;
margin: 0;
box-shadow: 0 0 5px 2px #AAA;
-moz-box-shadow: 0 0 5px 2px #AAA;
-webkit-box-shadow: 0 0 5px 2px #AAA;

}
于 2013-05-04T04:34:47.343 に答える