W3School TIY Editor
W3School 在线教程
改变方向
暗黑模式
运行代码
<!DOCTYPE html> <html lang="en"> <title>HTML</title> <meta charset="utf-8"> <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"> </script> <![endif]--> <style> body { font-family:Verdana,sans-serif;font-size:0.8em; } header,footer,section,article { border:1px solid grey; margin:5px;margin-bottom:15px;padding:8px; background-color:white; } header,footer { color:white;background-color:#444;margin-bottom:5px; } section { background-color:#ddd; } nav ul { margin:0;padding:0; } nav ul li { display:inline; margin:5px; } </style> <body> <header> <h1>Monday Times</h1> </header> <nav> <ul> <li>News</li> <li>Sports</li> <li>Weather</li> </ul> </nav> <section> <h2>News Section</h2> <article> <h2>News Article</h2> <p>Ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum.</p> <p>Ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum.</p> <p>Ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum.</p> </article> <article> <h2>News Article</h2> <p>Ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum.</p> <p>Ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum.</p> <p>Ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum ipsum lurum hurum turum.</p> </article> </section> <footer> <p>© 2014 Monday Times. All rights reserved.</p> </footer> </body> </html>