HTML Paragraphs

Paragraphs are defined with the <p> ... </p> tag.
Paragraphs may contain text and inline elements. They are block elements, but they may not contain other block elements, including other paragraphs.
The length of the displayed text will be adjusted by the opening size of the browser.
Browsers automatically add an empty line before and after a paragraph, so, the distance between two successive paragraphs is of two lines.

  - Example:
HTML codeDisplays in browser
<html> 
<head>
<title>Document title</title>
</head>
<body>
<p>Paragraph 1</p>
<p>Paragraph 2</p>
<p>Paragraph 3</p>
<p>Paragraph 4</p>
</body>
</html>

Paragraph 1

Paragraph 2

Paragraph 3

Paragraph 4

Line Breaks

The <br /> tag inserts a line break in the content, it allows you to control where to add new line breaks, to force the beginning of a new line at a particular poinnt.

  - Example:
HTML codeDisplays in browser
<html> 
<head>
<title>Document title</title>
</head>
<body>
<h1>Heading 1</h1>
<p>Paragraph 1<br />
Line 2<br />
Line 3<br />
... </p>
<p>Paragraph 2</p>
</body>
</html>
Heading 1

Paragraph 1
Line 2
Line 3
...

Paragraph 2

- <br /> is an empty element, but may contain attribute (id, class, style).
Example:     <br id="idb" />

Horizontal rule

The <hr> (<hr /> for XHTML) tag creates a horizontal line in an HTML page.
The <hr> element can be used to divide a web page into different horizontal areas.
The <hr> tag is a block level element, and it uses the following attributes:
  - Example:
HTML codeDisplays in browser
<html> 
<head>
<title>Document title</title>
</head>
<body>
<h1>Heading 1</h1>
<p>Paragraph 1<br />
Line 2<br />
Line 3<br />
... </p>
<hr>
Some text ...
<hr color="#1111fe" size="4" width="50%">
<p>Paragraph 2</p>
</body>
</html>
Heading 1

Paragraph 1
Line 2
Line 3
...


Some text ...

Paragraph 2

- The preferred way of formatting a horizontal rule is by using CSS, adding an "id" or "class" attribute, or directly "style".
Example:     <hr style="width:50%; height:4px; color:#1111fe" />

Daily Test with Code Example

HTML
CSS
JavaScript
PHP-MySQL
Which tag is used to include external CSS file in web page?
<body> <script> <link>
<link href="/templ/style.css" rel="stylesheet" type="text/css" />
Which CSS property sets the text size?
font-weight text-decoration font-size
h2 {
  font-size: 1em;
}
Indicate the JavaScript property that can add HTML code into an element.
text value innerHTML
document.getElementById("someID").innerHTML = "HTML content";
Click on the function that returns the number of characters of a string in PHP.
count() strlen() stristr()
$str = "http://CoursesWeb.net/";
$nr_chr = strlen($str);
echo $nr_chr;       // 22
Paragraphs, Line break, Horizontal rule

Last accessed pages

  1. Recursive function to create Multi-Level Menu in PHP (3222)
  2. PHP MySQL - SELECT, ORDER BY (5589)
  3. Crab And Pearl (1056)
  4. Create Array of Unique Random Numbers or Letters (268)
  5. ActionScript 3 - Change MovieClip Color (3895)

Top accessed pages

  1. Courses Web: PHP-MySQL JavaScript Ajax HTML CSS Flash-AS3 (31622)
  2. PHP-MySQL free course, online tutorials PHP MySQL code (25812)
  3. Get Attribute (ID, Class, Name, Title, Src) with jQuery (24768)
  4. Read Excel file data in PHP - PhpExcelReader (23882)
  5. PHP PDO - exec (INSERT, UPDATE, DELETE) MySQL (21572)