Creating a simple web page 4/9/2019
Objectives Creats a simple web page Use HTML tags for structuring the web page Tags used: h1, h2, head, body, p, img Use CSS for styling the web page Styles used font-size, text-align, margin, color, background-color, font-family, font-size 4/9/2019
HTML file & CSS file First.html link Bgoose.css 4/9/2019
Final Rendition 4/9/2019
webpage1.html <!DOCTYPE html> <html><head> <meta charset="utf-8"> <title>EAP Course</title> <link rel="stylesheet" type="text/css" href="amrita.css"> </head> <body><h1><img src="images/amrita.png" alt="Amrita Uuniversity logo"><br>Amrita University</h1> <h2>Emerging Applications and Platforms</h2> <p>This course deals with emerging applications and platforms in the current technology sector.</p> <h2>Discussion</h2> <p>We will have lectures..<em>Hands-on exercies</em> and learn through doing.</p> <h2>Grading Policy</h2> <p>2 tests, 1 exam, 1 mini-project, many hands-on exercises<br> </p> </body> </html> 4/9/2019
.css body { background-color: #faf2e4; margin: 0 15%; font-family: sans-serif; } h1 { text-align: center; font-family: serif; font-weight: normal; text-transform: uppercase; border-bottom: 1px solid #57b1dc; margin-top: 30px; h2 { color: #d1633c; font-size: 1em; 4/9/2019
Summary We created a simple web page We added style Lets remove the style sheet and check the plain output. Lets modify some of the style elements and check the effect. 4/9/2019