Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Text Markup | Tags and Attributes

Text MarkupText Markup

Paragraph

The <p> tag is used to define a paragraph of text. By default, each paragraph starts on a new line. The <p> tag is commonly used for displaying text content, such as articles, blogs, and other forms of textual information on a web page.

The <p> tag is also crucial for search engine optimization, as search engines use it to understand a web page's structure and identify the main content. Using of <p> tag for all text content on the web page is recommended. Exceptions are heading, list item or other specialized type of content

html

index.html

css

index.css

js

index.js

Note

In an integrated development environment (IDE), a software application that helps programmers develop software code efficiently, we can use lorem functionality to generate text that can be used to fill in the content for design and layout purposes. For example, we can type lorem20 in the HTML document and press the Enter key. This will create a 20 words length of text. Instead of 20, any number can be used.

Headings

Headings <h1> ... <h6> are used to define the hierarchy and structure of a web page. Headings provide context for the content on the page, help users navigate the page, and are also used by search engines to understand the page's content. The <h1> to <h6> tags are used to create headings of different sizes and levels of importance, with <h1> being the most important and <h6> being the least important. It is good practice to use headings in a logical order and avoid skipping levels (e.g., going from <h1> to <h3> without using <h2>).

html

index.html

css

index.css

js

index.js

Lists

In HTML, lists can be created using two main tags: <ul> (unordered list) and <ol> (ordered list).

Unordered List (<ul>)

<ul> creates a list with bullet points or other markers for each item without any specific order or ranking. Each item is enclosed in a <li> (list item) tag, which creates a separate bullet point for each item.

html

index.html

css

index.css

js

index.js

Ordered List (<ol>)

<ol>, on the other hand, is used to create a list with a specific order or ranking. The list items are numbered sequentially using the <li> tag. You can also specify a start value for the numbering using the start attribute in the <ol> tag.

html

index.html

css

index.css

js

index.js

List nesting

Both <ul> and <ol> can be nested inside each other to create sub-lists. For example, you can create a numbered list (<ol>) with nested bullet point lists (<ul>) for each item.

html

index.html

css

index.css

js

index.js

1. What is the purpose of the `<p>` tag in HTML?
2. What are the two main types of lists in HTML?
3. What HTML tag is used to create an ordered list?

What is the purpose of the <p> tag in HTML?

Виберіть правильну відповідь

What are the two main types of lists in HTML?

Виберіть правильну відповідь

What HTML tag is used to create an ordered list?

Виберіть правильну відповідь

Все було зрозуміло?

Секція 2. Розділ 5

Text MarkupText Markup

Paragraph

The <p> tag is used to define a paragraph of text. By default, each paragraph starts on a new line. The <p> tag is commonly used for displaying text content, such as articles, blogs, and other forms of textual information on a web page.

The <p> tag is also crucial for search engine optimization, as search engines use it to understand a web page's structure and identify the main content. Using of <p> tag for all text content on the web page is recommended. Exceptions are heading, list item or other specialized type of content

html

index.html

css

index.css

js

index.js

Note

In an integrated development environment (IDE), a software application that helps programmers develop software code efficiently, we can use lorem functionality to generate text that can be used to fill in the content for design and layout purposes. For example, we can type lorem20 in the HTML document and press the Enter key. This will create a 20 words length of text. Instead of 20, any number can be used.

Headings

Headings <h1> ... <h6> are used to define the hierarchy and structure of a web page. Headings provide context for the content on the page, help users navigate the page, and are also used by search engines to understand the page's content. The <h1> to <h6> tags are used to create headings of different sizes and levels of importance, with <h1> being the most important and <h6> being the least important. It is good practice to use headings in a logical order and avoid skipping levels (e.g., going from <h1> to <h3> without using <h2>).

html

index.html

css

index.css

js

index.js

Lists

In HTML, lists can be created using two main tags: <ul> (unordered list) and <ol> (ordered list).

Unordered List (<ul>)

<ul> creates a list with bullet points or other markers for each item without any specific order or ranking. Each item is enclosed in a <li> (list item) tag, which creates a separate bullet point for each item.

html

index.html

css

index.css

js

index.js

Ordered List (<ol>)

<ol>, on the other hand, is used to create a list with a specific order or ranking. The list items are numbered sequentially using the <li> tag. You can also specify a start value for the numbering using the start attribute in the <ol> tag.

html

index.html

css

index.css

js

index.js

List nesting

Both <ul> and <ol> can be nested inside each other to create sub-lists. For example, you can create a numbered list (<ol>) with nested bullet point lists (<ul>) for each item.

html

index.html

css

index.css

js

index.js

1. What is the purpose of the `<p>` tag in HTML?
2. What are the two main types of lists in HTML?
3. What HTML tag is used to create an ordered list?

What is the purpose of the <p> tag in HTML?

Виберіть правильну відповідь

What are the two main types of lists in HTML?

Виберіть правильну відповідь

What HTML tag is used to create an ordered list?

Виберіть правильну відповідь

Все було зрозуміло?

Секція 2. Розділ 5
some-alt