Difference between revisions of "Team:SBS SH 112144/sandbox"
| Line 7: | Line 7: | ||
<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/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" /> | <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> | </head> | ||
<body> | <body> | ||
Revision as of 14:07, 16 October 2018
<section id="banner">
<header>
Contents
Welcome to Projection
</header>
Aliquam
Suspendisse amet ullamco
Elementum
Class aptent taciti ad litora
Ultrices
Nulla vitae mauris non felis
<footer> <a href="#" class="button">Get Started</a> </footer>
</section>
<section id="three" class="wrapper align-center">
<article>
<img src="images/pic01.jpg" alt="Pic 01" />
<header>
Lorem ipsum
dolor amet nullam
</header>
Morbi in sem quis dui placerat ornare. Pellentesquenisi
euismod in, pharetra a, ultricies in diam sed arcu. Cras
consequat egestas augue vulputate.
<footer> <a href="#" class="button">Learn More</a> </footer> </article> <article>
<img src="images/pic02.jpg" alt="Pic 02" />
<header>
Sed feugiat
tempus adipicsing
</header>
Pellentesque fermentum dolor. Aliquam quam lectus
facilisis auctor, ultrices ut, elementum vulputate, nunc
blandit ellenste egestagus commodo.
<footer> <a href="#" class="button">Learn More</a> </footer> </article>
</section>
<footer id="footer">
© Untitled. Design: <a href="https://templated.co">TEMPLATED</a>. Images: <a href="https://unsplash.com">Unsplash</a>.
</footer>
</body> </html>