Creating you first web page!
Download as PPTX, PDF0 likes113 views
This document provides guidance on creating a personal web page, explaining key concepts such as personal and home pages, headings, paragraphs, and lists. It describes the use of specific HTML tags for structuring content and presents exercises for practical application. Additionally, it covers list types and their formatting using CSS.
Creating you first web page!
- 1. Creating you First Web page! BY. TR. MJ FERNANDEZ JOY IN LEARNING SCHOOL
- 2. Objectives: 1. Define a personal page; 2. Define home page; 3. Apply the different levels of headings; 4. Write web contents in paragraphs and use the line breaks; 5. And list and; 6. Create a simple web page.
- 3. What is personal web page? Show your thought, ideas, interest, hobbies, friends, and family that you strongly want to inform others. ◦ An online diary ◦ Family ◦ Pets ◦ Self-written books poems ◦ Favorite topics, health, politics, music, arts, etc.
- 4. What is home page? Home page serves as the entry point in your website. It is the page that is first displayed by the browser when you type in website address. It includes: ◦ A welcome message or introduction ◦ A logo- for website branding ◦ The site navigation bar- a link other pages on your website. ◦ Latest update and modification of you site.
- 5. Creating your headings. Headings is used to give emphasis to a certain topic title. Normally, text on the Home page is given a different look your normal text.
- 6. Hands-on exercise 6.1: Applying headings 1. Launch Notepad 2. type the following syntax: 3. Save you documents as six levels Of headings.hmtl. 4. to check the output, open your file in browser.
- 8. Creating paragraphs and Line Breaks Writers separate their and arguments into sequence of paragraphs. The <p> elements is used to mark a block into paragraph. Line Breaks: this tag forces the browser to have single line break. It is just like pressing the Enter key separate a blank space or start a new line in MS word.
- 9. Adding list A list is series of names, words, or other items written printed, or imagined one after the other. TAGS DESCRIPTION <ol> Defines an ordered list items. (number list) <ul> Defines an unordered list items. (bulleted list) <li> It is used for specifying a list item <dl> It is used for declaring a definition
- 10. Unordered HTML List - Choose List Item Marker The CSS list-style-type property is used to define the style of the list item marker: Value Description disc Sets the list item marker to a bullet (default) circle Sets the list item marker to a circle square Sets the list item marker to a square none The list items will not be marked
- 11. Example - Disc
- 12. Example - Circle
- 13. Example - Square
- 14. Example - None
- 15. Ordered HTML List An ordered list starts with the <ol> tag. Each list item starts with the <li> tag. The type attribute of the <ol> tag, defines the type of the list item marker: Type Description type="1" The list items will be numbered with numbers (default) type="A" The list items will be numbered with uppercase letters type="a" The list items will be numbered with lowercase letters type="I" The list items will be numbered with uppercase roman numbers type="i" The list items will be numbered with lowercase roman numbers
- 16. Numbers:
- 22. HTML Description Lists HTML also supports description lists. A description list is a list of terms, with a description of each term. The <dl> tag defines the description list, the <dt> tag defines the term (name), and the <dd> tag describes each term:
- 24. Control List Counting By default, an ordered list will start counting from 1. If you want to start counting from a specified number, you can use the start attribute:
- 26. References: https://www.w3schools.com/html/html_lists.asp D whiz in Web designing HTML and CSS