HTML Document<!DOCTYPE html> <html> <head> <!-- HTML head --> </head> <body> <!-- HTML body --> </body> </html> Comment<!-- --> Line feed<br/> Header and Paragraph<h3></h3> <p> </p> Show and Hide Details<details> <summary></summary> <p> </p> </details> Preformated Text<pre> </pre> List<ul> <li>∙</li> <li>∙</li> </ul> <ol> <li>∙</li> <li>∙</li> </ol> Directory List<dl> <dt></dt> <dd></dd> </dl> Hyperlink<a href=""></a> <a href="" target=""></a> <a href="" target="" title=""></a> <a href="?Category=&Page=" target=""></a> <a href="?Category=&Page=" target="" title=""></a> <a href="/User/?Category=&Page=" target=""></a> Image<img src="" width="" height=""> Audio<audio id="myAudio" style="max-width:100%" controls autoplay> <source src="" type="audio/mp3"> </audio> Video<video id="myVideo" style="max-width:100%" controls autoplay> <source src=""> </video> Table<table> <tr> <td></td> <td></td> </tr> </table> <table border="0" width="100%"> <colgroup> <col width="4*"> <col width="2*"> <col width="1*"> </colgroup> <tr> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> </tr> </table> Flex Box<style type="text/css"> .flex-container { display: -webkit-flex; display: flex; /* float: left; */ } .flex-item { /* padding:2px; */ padding-left: 16px; padding-right: 16px; /*margin: 16px 0px 0px 0px; margin: 1em; margin-left: 0px; margin-right: 0px; margin: */ /* border-radius: 0.5em; */ box-shadow: inset -2px -2px 10px #ccc; border: 1px solid #999; } .flex1 { /* margin-right: 10px; */ -webkit-flex: 1 1 25em; flex-grow: 1; flex-shrink: 1; flex-basis: 70%; background: white; } .flex2 { margin-left: 10px; -webkit-flex: 2 2 25em; flex-grow: 1; flex-shrink: 2; flex-basis: 30%; background: white; } </style> <div class="flex-container"> <div class="flex-item flex1"> <h4></h4> <pre> </pre> </div> </div> <div class="flex-container"> <div class="flex-item flex1"> <h4></h4> <pre> </pre> </div> <div class="flex-item flex2"> <h3></h3> <pre> </pre> </div> </div> Box 1 HeadBox 1 body. Box 2 HeadBox 2 body. Box 3.1 HeadBox 3.1 body. Box 3.2Box 3.2 body. |
|