ドキュメント</title&g t;</p> <p> < ;link rel="stylesheet" href="easyui.css"/></p> <p> <script src="jquery-1.8.3.js"></script></p> <p> <!--<script src="jquery.easyui.min.js"></script>--></p> <p> <script src="test.js"></script></p> <p><br></p> <p> <style> </p> <p> *{</p> <p> margin: 0;</p> <p> padding:0;</p> <p> }</p> <p> </p> <p> .main_ obj{</p> <p> width: 500px;</p> <p> height: 240px;</p> <p> /*background-color: #9cf;* /</p> <p> margin:0 auto;</p> <p> margin-top: 200px;</p> <p> }</p> <p> .ben_main,.lai_main{</p> <p> : 230px;</p> <p> width: 220px;</p> <p> オーバーフロー: 非表示;</p> <p> フロート: 左;</p> <p> /*background-color: #cccccc;*/</p> <p><br></p> <p><br></p> <p> }</p> <p> .ben{</p> <p> : #464646;</p> <p> 位置: 相対;</p> <p> }</p> <p> .ben_1 {</p> <p> 高さ: 25px;</p> <p> width:190px;</p> <p> 上: 45px;</p> <p> 左: 14px;</p> <p> }</p> <p> .ben_2{</p> <p> 幅: 25px;</p> <p> 高さ:234px;</p> <p> 左: 95px ;</p> <p> }</p> <p> .ben_3{</p> <p> 幅: 143px;</p> <p> 高さ: 220px;</p> <p> 境界線: 20 px ソリッド #464646;</p> <p> position:relative ;</p> <p> border-radius:100px;</p> <p> top: -177px ;</p> <p> left:17px;</p> <p><br> </p> }<p> </p> .ben_4{<p> </p> width: 80px;<p> </p>高さ: 25px;<p> </p> top: -330px;<p> </p> left:68px;<p> </p> }<p> </p> .lai_main {<p> </p> float: right;<p> </p> /*background-color:#ccc ;*/<p> </p> }<p> </p> .lai_1{<p> </p> top: 140px;<p> </p> <p><br> </p> }<p> </p> .lai_2{<p> </p> width: 150px;<p> </p> height: 150px;<p> </p> border: 20px ソリッド #98b821;<p> </p> border-radius:100px ;<p> </p> 相対位置: ;<p> </p> 上: -151px;<p> </p> 左: -13px;<p> </p> <p><br> </p> <p><br> }</p> <p> .lai_3{</p> <p> 高さ: 40px;</p> <p> 幅: 180px;</p> <p> オーバーフロー: hidden;</p> <p> /*背景色: 赤;*/</p> <p> 位置: 相対;</p>: <p> 高さ: 40px;</p> <p> 背景色:#98b821 ;</p> <p> 位置: 相対;</p> <p> トップ: -482px;</p> <p> 左: 38px;</p> <p> transform:rotate(35deg);</p> <p> }</p> <p> .lai_4:before{</p> <p> content: "";</p> <p> 表示: block;</p> <p> width: 15px;</p> <p>高さ: 20px;</p> <p> 背景色: #ffffff;</p> <p> 位置: 相対;</p> <p> 左: -15px;</p> <p> 上: 4px;</p> }<p> </p> .lai_5{<p> </p> Transform:rotate(145deg);<p> </p> 位置: 相対;<p> </p> 左: 155px;<p> </p> 上: -522px;<p> </p> }<p> </p> .lai_5:before{<p> </p> content: "";<p> </p> 位置:相対;<p> </p> left: -15px;<p> </p>トップ: 15px;<p> </p> }<p> </p> .lai2_out{<p> </p> 高さ: 61px;<p> </p> 幅: 188px;<p> </p> /* 背景色: #0092DC; */<p> </p> 位置: 相対;<p> </p> 上: -446px;<p> </p> 左: 15px;<p> </p> オーバーフロー: 非表示;<p> </p>変換: 回転(2度);<p> </p> <p></p> <p> }</p> <p> .lai2_1{</p> <p> width : 150px;</p> <p> 高さ: 150px;</p> <p> border: 20px ソリッド #98b821;<br> </p> border-radius: 100px;<p> </p> 位置: 相対;<p> </p> top:-142px;<p> </p> <p></p> <p></p> <p> </p> <p></p> <p> }</p> <p> .lai2_2{<br> </p> width: 20px;<p> <br> height: 33px;</p> <p> 背景色: #98b821;<br> </p>位置: 相対;<p> </p> トップ: -183px;<p> </p> 変換: 回転(45度);<p> </p> 左: 27px<p> </p> }<p> </p> .lai2_2:before{<p> </p> content: "";<p> </p> 表示: block;<p> </p> 幅: 23px;<p> </p> 高さ: 34px;<p> </p> 背景色: #ffffff;<p> </p>位置: 相対;<p> </p> 上: 0px;<p> </p> 左: -23px;<p> </p> }<p> </p> .lai2_3{<p> </p> 変換:回転(135度);<p> </p> 上: -222px;<p> </p> 左: 150px;<p> </p> } <p> </p> .lai2_3:before{<p> </p> 位置: 相対;<p> </p> 上: 13px;<p> 左: -23px;</p> <p> } </p> <p> </style></p> <p></head></p> <p><body></p> <p><!--<section>--></p> <p><br /></p> <p><section></p> <p> <div></p> <p> <div class="ben_1 ben"></div></p> <p> <div class="ben_2 ben"></div></p> <p> <div></ div></p> <p> < div class="ben_4 ben"></div></p> <p> </div></p> <p> <div></p> <p> <div class="ben_1 ben"></div> </p> <p> </p> <div class="ben_2 ben"> <p> <div class="ben_3 lai_1"></div></p> <p> <!--方式一-><br></p> <p> <!- -<div>--></p> <!--<div></div>--><p> </p> <!--</div>--><p> </p> <p> <!--<div class="lai_4 lai_5"></div>--></p> <p> <!-- 方式二 -></p> <p> <div class="lai2_out"></p> <p> <div class="lai2_1"></div></p> <p> <div class="lai2_2"></div> </p> <p> <div class="lai2_2 lai2_3"></div></p> <p> </div></p> <p> </div></p> <p></p> <p></p> </div>
