update hr element guide to indicate use for separating themes; remove … (#34612)
* update hr element guide to indicate use for separating thems; remove xhtml syntax as it is outdated and confusing to beginners * fix title syntax * Add resources back in for hr help page
This commit is contained in:
committed by
Randell Dawson
parent
8635a777c6
commit
de5b88265f
@ -3,21 +3,16 @@ title: Create a Horizontal Line Using the hr Element
|
|||||||
---
|
---
|
||||||
## Create a Horizontal Line Using the hr Element
|
## Create a Horizontal Line Using the hr Element
|
||||||
|
|
||||||
The `hr` tag is one of the simplest HTML elements. It creates a thin horizontal line line across its parent element.
|
The `hr` tag is one of the simplest HTML elements. It represents a thematic change in content and creates a thin horizontal line across its parent element.
|
||||||
|
|
||||||
This lesson uses the `hr` tag to separate the title and content of a "card". So how do you create an `hr` element?
|
This lesson requires you to use the `hr` tag to separate the title and content of a "card". So how do you create an `hr` element?
|
||||||
|
|
||||||
```html
|
```html
|
||||||
<!-- It's this easy -->
|
<!-- It's this easy. Note that it does not have a closing tag. -->
|
||||||
<hr>
|
<hr>
|
||||||
```
|
```
|
||||||
|
|
||||||
This element is self-closing, but to be friendly to parsers and style checkers you should add an explicit closing marker.
|
Add this tag between the title and content to create the horizontal line in [this lesson](https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/) on [freeCodeCamp](https://www.freecodecamp.org/). Here is a screenshot from that lesson showing an `hr` element contained within the "cardText" div.
|
||||||
```html
|
|
||||||
<hr />
|
|
||||||
```
|
|
||||||
|
|
||||||
Whichever format you choose it will create a horizontal line as in [this lesson](https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/) on [freeCodeCamp](https://www.freecodecamp.org/). Here is a screenshot from that lesson showing an `hr` element contained within a div.
|
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
|
Reference in New Issue
Block a user