Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <title>Title of the document</title> <meta charset="utf-8"> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <style> body { font-size: 0.9em; } header, footer { padding: 10px; color: white; background-color: black; text-align: center; } h2 { text-align: center } h3 { text-align: right; padding-right: 20px; } section { margin: 5px; padding: 20px; background-color: lightgrey; } article { margin: 20px; padding: 10px; background-color: white; } nav ul { padding: 0; } nav ul li { display: inline; margin: 5px; } </style> </head> <body> <header> <h1>LaravelSoft</h1> </header> <nav> <ul> <li> <a href="https://www.w3docs.com/learn-html.html">Books</a> </li> <li> <a href="https://www.w3docs.com/quiz/">Quizzes</a> </li> <li> <a href="https://www.w3docs.com/snippets">Snippets</a> </li> <li> <a href="https://www.w3docs.com/tool/">Tools</a> </li> <li> <a href="https://www.w3docs.com/string-functions/">String Functions</a> </li> </ul> </nav> <section> <h2>Article Section</h2> <article> <h3>Article Title</h3> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque in porta lorem. Morbi condimentum est nibh, et consectetur tortor feugiat at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque in porta lorem. Morbi condimentum est nibh, et consectetur tortor feugiat at. </p> </article> <article> <h3>News Article</h3> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque in porta lorem. Morbi condimentum est nibh, et consectetur tortor feugiat at. </p> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque in porta lorem. Morbi condimentum est nibh, et consectetur tortor feugiat at. </p> </article> </section> <footer> <p>© 2020 All rights reserved.</p> </footer> </body> </html>