|
|
| (13 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| − | {{Fudan}}
| |
| − | <html>
| |
| − | <head>
| |
| − | <meta charset="utf-8" />
| |
| − | <meta name="viewport" content="width=device-width, initial-scale=1" />
| |
| | | | |
| − | <link rel="stylesheet" type="text/css" href="https://2018.igem.org/wiki/index.php?title=Template:SBS_SH_112144/main.css&action=raw&ctype=text/css">
| |
| − | <link rel="stylesheet" type="text/css" href="https://2018.igem.org/wiki/index.php?title=Template:SBS_SH_112144/font-awesome.css&action=raw&ctype=text/css" />
| |
| − | <style type="text/css">
| |
| − | *{margin: 0;padding: 0;list-style: none;}
| |
| − | /* via: https://blog.csdn.net/weixin_41014370/article/details/79523637 */
| |
| − |
| |
| − | /** 清除内外边距 **/
| |
| − | body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
| |
| − | dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
| |
| − | pre, /* text formatting elements 文本格式元素 */
| |
| − | form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
| |
| − | th, td /* table elements 表格元素 */ {
| |
| − | margin: 0;
| |
| − | padding: 0;
| |
| − | }
| |
| − |
| |
| − | /** 设置默认字体 **/
| |
| − |
| |
| − | h1, h2, h3, h4, h5, h6 { font-size: 100%; }
| |
| − | address, cite, dfn, em, var { font-style: normal; } /* 将斜体扶正 */
| |
| − | code, kbd, pre, samp { font-family: courier new, courier, monospace; } /* 统一等宽字体 */
| |
| − | small { font-size: 12px; } /* 小于 12px 的中文很难阅读，让 small 正常化 */
| |
| − |
| |
| − | /** 重置列表元素 **/
| |
| − | ul, ol { list-style: none; }
| |
| − |
| |
| − | /** 重置文本格式元素 **/
| |
| − | a { text-decoration: none; }
| |
| − | a:hover { text-decoration: underline; }
| |
| − |
| |
| − | /** 重置表单元素 **/
| |
| − | legend { color: #000; } /* for ie6 */
| |
| − | fieldset, img { border: 0; } /* img 搭车：让链接里的 img 无边框 */
| |
| − | button, input, select, textarea { font-size: 100%; } /* 使得表单元素在 ie 下能继承字体大小 */
| |
| − | /* 注：optgroup 无法扶正 */
| |
| − |
| |
| − | /** 重置表格元素 **/
| |
| − | table { border-collapse: collapse; border-spacing: 0; }
| |
| − |
| |
| − | /* 清除浮动 */
| |
| − | .ks-clear:after, .clear:after {
| |
| − | content: '\20';
| |
| − | display: block;
| |
| − | height: 0;
| |
| − | clear: both;
| |
| − | }
| |
| − | .ks-clear, .clear {
| |
| − | *zoom: 1;
| |
| − | }
| |
| − | </style>
| |
| − | </head>
| |
| − | <body>
| |
| − |
| |
| − | <!-- Header -->
| |
| − | <header id="header">
| |
| − | <div class="inner">
| |
| − | <a href="index.html" class="logo"><strong>Projection</strong> by TEMPLATED</a>
| |
| − | <nav id="nav">
| |
| − | <a href="index.html">Home</a>
| |
| − | <a href="generic.html">Generic</a>
| |
| − | <a href="elements.html">Elements</a>
| |
| − | </nav>
| |
| − | <a href="#navPanel" class="navPanelToggle"><span class="fa fa-bars"></span></a>
| |
| − | </div>
| |
| − | </header>
| |
| − | </body>
| |
| − | </html>
| |
| − |
| |
| − | <!-- Banner -->
| |
| − | <section id="banner">
| |
| − | <div class="inner">
| |
| − | <header>
| |
| − | <h1>Welcome to Projection</h1>
| |
| − | </header>
| |
| − |
| |
| − | <div class="flex ">
| |
| − |
| |
| − | <div>
| |
| − | <span class="icon fa-car"></span>
| |
| − | <h3>Aliquam</h3>
| |
| − | <p>Suspendisse amet ullamco</p>
| |
| − | </div>
| |
| − |
| |
| − | <div>
| |
| − | <span class="icon fa-camera"></span>
| |
| − | <h3>Elementum</h3>
| |
| − | <p>Class aptent taciti ad litora</p>
| |
| − | </div>
| |
| − |
| |
| − | <div>
| |
| − | <span class="icon fa-bug"></span>
| |
| − | <h3>Ultrices</h3>
| |
| − | <p>Nulla vitae mauris non felis</p>
| |
| − | </div>
| |
| − |
| |
| − | </div>
| |
| − |
| |
| − | <footer>
| |
| − | <a href="#" class="button">Get Started</a>
| |
| − | </footer>
| |
| − | </div>
| |
| − | </section>
| |
| − |
| |
| − |
| |
| − | <!-- Three -->
| |
| − | <section id="three" class="wrapper align-center">
| |
| − | <div class="inner">
| |
| − | <div class="flex flex-2">
| |
| − | <article>
| |
| − | <div class="image round">
| |
| − | <img src="images/pic01.jpg" alt="Pic 01" />
| |
| − | </div>
| |
| − | <header>
| |
| − | <h3>Lorem ipsum<br /> dolor amet nullam</h3>
| |
| − | </header>
| |
| − | <p>Morbi in sem quis dui placerat ornare. Pellentesquenisi<br />euismod in, pharetra a, ultricies in diam sed arcu. Cras<br />consequat egestas augue vulputate.</p>
| |
| − | <footer>
| |
| − | <a href="#" class="button">Learn More</a>
| |
| − | </footer>
| |
| − | </article>
| |
| − | <article>
| |
| − | <div class="image round">
| |
| − | <img src="images/pic02.jpg" alt="Pic 02" />
| |
| − | </div>
| |
| − | <header>
| |
| − | <h3>Sed feugiat<br /> tempus adipicsing</h3>
| |
| − | </header>
| |
| − | <p>Pellentesque fermentum dolor. Aliquam quam lectus<br />facilisis auctor, ultrices ut, elementum vulputate, nunc<br /> blandit ellenste egestagus commodo.</p>
| |
| − | <footer>
| |
| − | <a href="#" class="button">Learn More</a>
| |
| − | </footer>
| |
| − | </article>
| |
| − | </div>
| |
| − | </div>
| |
| − | </section>
| |
| − |
| |
| − | <!-- Footer -->
| |
| − | <footer id="footer">
| |
| − | <div class="inner">
| |
| − |
| |
| − | <div class="copyright">
| |
| − | © Untitled. Design: <a href="https://templated.co">TEMPLATED</a>. Images: <a href="https://unsplash.com">Unsplash</a>.
| |
| − | </div>
| |
| − |
| |
| − | </div>
| |
| − | </footer>
| |
| − |
| |
| − | <!-- Scripts
| |
| − | <script src="assets/js/jquery.min.js"></script>
| |
| − | <script src="assets/js/skel.min.js"></script>
| |
| − | <script src="assets/js/util.js"></script>
| |
| − | <script src="assets/js/main.js"></script>
| |
| − | -->
| |
| − | </body>
| |
| − | </html>
| |
