PHP & JavaScript Room :: 設置サンプル

Spiffy Box設置サンプル

実行結果

This is a header

This is for your content.

This is for your content.

This is for your content.

ソース

<style type="text/css">
    /* Spiffy Box - http://www.spiffybox.com/index.php */
    .cnbox, .cnbox_body, .cnbox_head, .cnbox_head div {
        background:transparent url(/content/img/css/corner3.gif) no-repeat bottom right;
    }
    .cnbox{
        width:335px !important; width: 320px;
        margin:5px auto; padding-right:15px;
    }
    .cnbox_head {
        background-position:top right;
        margin-right:-15px;
        padding-right:40px;
    }
        .cnbox_head div {
            background-position:top left;
            margin:0; padding:10px 0 5px 20px;
            border:0;
            height:auto !important; height:1%;
            color:#fff; font-weight:bold; font-size:1.5em;
        }
    .cnbox_body {
        background-position:bottom left;
        margin-right:25px; padding:5px 0 10px 20px;
    }
</style>

<div class="cnbox">
    <div class="cnbox_head">
        <div>This is a header</div>
    </div>
    <div class="cnbox_body">
        <p>This is for your content.</p>
        <p>This is for your content.</p>
        <p>This is for your content.</p>
    </div>
</div>

polarized women