Scribd
Upload
2 views

Notes

Uploaded by

leeanthonylee
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
2 views

Notes

Uploaded by

leeanthonylee
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 7

Diether R.

Goyagoy
STEM 12 - St. Patrick

From the videos and websites we have for our references on the first day of immersion, I
learned that html is not as easy as it seems. HTML or Hypertext Markup Language is the
basic language and the standard markup language for making web pages and it consists of a
series elements such as paragraph body, heading, and many more. The following steps is
shown below ;

1. <!DOCTYPE html> - This is the indication that you are using an HTML document.
2. <html> - Root element of HTML.
3. <head> - It contains the meta information about HTML
4. <title>Page Title</title> - This is the title shown in the page's tab.
5. </head>
6. <body> - It defines the document such as the paragraphs, headings, links, and images.
7. <h1>My First Heading</h1> - Uses of large headings.
8. <p>My first paragraph.</p> - Just simply paragraphs.
9. </body>
10. </html>

Example :

1. <!DOCTYPE html>
2. <html>
3. <head>
4. <title>My Immersion</title>
5. </head>
6. <body>
7. <h1>Experience</h1>
8. <p>It was good and tiring.</p>
9. </body>
10. </html>

These are only the basic examples.


Also, in HTML you can put photos and hyperlinks or so called HTML Attributes. Every HTML
element has the ability of having attributes. Attributes give further details about an element and
the start tag is where attributes are always given typically, attributes are presented as
name/value pairs, such as name="value".

1. The Href Attribute - The URL of the page the link leads to is specified by the href
attribute and <a> defines hyperlinks.
Ex :

2. The Src Attribute - Used to insert images. There are two ways to specify the URL in
the src attribute:

1. Links to an external image located on another website are known as


absolute URLs.
Src="https://www.robotics.com/images/img_humanrobot.jpg" is an
example image.

2. Relative URL: Provides a link to a picture posted on the website. The


domain name is not included in the URL in this case. The URL will be
relative to the current page if it starts without a slash. For instance,
src="img_humanrobot.jpg". The URL will be relative to the domain if it
starts with a slash. src="/images/img_girl.jpg" is an example.

3. The Width and Height Attributes - The width and height of the image.

Ex :

HTML Headings
- Covers how to create headings of different sizes for structuring content. HTML headings
are defined with the <h1> to <h6> tags. Also, you can adjust the font size.

HTML Paragraphs

- Explains how to create text paragraphs for writing content.

HTML Styles

- introduces the concept of applying styles attribute is used to add styles to an


element, such as color, font, size, color of the background, and allignment,

HTML Formatting

- Formatting elements were designed to display special types of text:


1. <b> - Bold text
2. <strong> - Important text
3. <i> - Italic text
4. <em> - Emphasized text
5. <mark> - Marked text
6. <small> - Smaller text
7. <del> - Deleted text
8. <ins> - Inserted text
9. <sub> - Subscript text
10. <sup> - Superscript text

HTML Quotations

- Covers how to use quotations (blockquotes, inline quotations) for citing sources or
highlighting text.

HTML Comments

- Explains how to add comments to HTML code for documentation and readability.

HTML Colors

- Introduces different ways to specify colors (RGB, HEX, HSL) in HTML.

OTHER PART OF A HTML

HTML CSS
Explains how to integrate CSS with HTML for
styling and layout.

HTML Links Covers how to create links to other web


pages or resources.

HTML Images Shows how to create a small icon that


represents your website.

HTML Page Title :Explains how to set a title for your web page,
which appears in the browser tab.

HTML Tables Covers how to create tables for organizing


data.

HTML Lists Explains how to create lists (unordered,


ordered, definition lists) for presenting
information.
HTML Block & Inline Discusses the difference between block-level
and inline elements and their impact on
layout.

HTML Div Explains how to use the `<div>` element for


grouping content and applying styles.

HTML Classes Covers how to use classes for applying styles


to multiple elements.

HTML Id Explains how to use IDs for uniquely


identifying specific elements.

HTML File Paths Explains how to specify file paths for images,
scripts, and other resources.

HTML Head Covers the `<head>` section of an HTML


document and its purpose.

HTML Layout Explains different methods for designing web


page layouts.

HTML Responsive Introduces responsive design principles for


creating websites that adapt to different
screen sizes.

HTML Computer Code Covers how to display code snippets within


HTML.

HTML Style Guide Explains how to use special characters in


HTML.

HTML Symbols Covers how to display various symbols and


special characters.

HTML Charsets Discusses character encoding and its


importance for displaying text correctly.

HTML URL Encode Explains how to encode URLs for proper


handling.

HTML Emojis Explains how to use emojis in HTML

FORMS OF HTML
1. HTML Forms: Covers the basics of creating forms for user input.

2. HTML Form Attributes: Explains various attributes used with

form elements.

3. HTML Form Elements: Details different form elements like input

fields, buttons, and select lists.

4. HTML Input Types: Explains the different types of input fields

available in HTML.

5. HTML Input Attributes: Covers attributes specific to input

elements.

6. Input Form Attributes: Provides a detailed list of attributes for

form input elements.V. Graphics.

CSS TUTORIAL

- CSS is the language we use to style an HTML document. CSS describes


how HTML elements should be displayed.

Summary of CSS Tutorial:

1. Introduction: Explains what CSS is and how it helps make websites look
nice. Encourages trying out examples.

2. Basic Concepts: Covers how to write CSS, choose elements to style,


add CSS to web pages, and use colors.
3. Styling Elements: Shows how to change the look of different parts of a
webpage, like backgrounds, borders, text, and spacing.

4. Advanced Techniques: Talks about more tricky features like rounded


corners, color changes, shadows, and animations.

5. Responsive Design: Teaches how to make websites work well on


different screen sizes.

6. CSS Grid: Introduces a way to organize content on a page using CSS


Grid.

7. CSS SASS: Explains SASS, a tool that makes it easier to write CSS with
helpful features.

8. Examples and Resources: Provides practice exercises, quizzes, and


helpful materials for learning CSS, plus a learning plan and certificate.

You might also like