tm 2nd quarter - 1st meeting(html backgrounds)
DESCRIPTION
HTML BackgroundsTRANSCRIPT
HTML BackgroundsLearning by examples:
by: Engr. Esmeraldo T. Guimbarda Jr.
Activity:1. Open Notepad++. Click on Start > All Programs > Notepad++ folder > Notepad++.
2. Create a new HTML file by clicking File > New, or pressing Ctrl+N on your keyboard.
3. Save the file as “background.html”.
To save the file, go to File > Save As. Type “background.html” in the File name box. Select Hypertext Markup Language file in the Save as type selection menu. Save the file in your desktop.
4. Type the basic skeleton code of an HTML document.
5. Define the title as “SJS Philosophy Of Education”.
6. inside the body tag, create a heading <h1> and type “SJS Philosophy Of Education”.
7. under the heading <h1>, create a paragraph <p> then type in the philosophy of education of St. Joseph School.
8. Add the style tag <style> at the head <head> section, and create the ID’s.
9. Inside #PhilosophyID set width to 50%, margin-right to auto, margin-left to auto, text-align to center & color to yellow;
10. Create a division <div> to your paragraph <p>. Set division ID to PhilosophyID
11. Start adding the background to the body <body>. Change the background color to gray.
12. Add the provided background image, sjslogo.png
13. Set the background-repeat property to no-repeat. Set the image’s position to center & Set the background-attachment property to fixed
14. Save the file by clicking File > Save or pressing Ctrl + S on your keyboard.
15. Open the HTML file to your browser by clicking Run > Lunch in Chrome or Lunch in Firefox on your Notepad++
OUTPUT: