search

fluffy0301 / for_studying_odin

for_studying_odin
0 stars 0 forks source link

WORKING WITH TEXT #1

Open fluffy0301 opened 2 years ago

fluffy0301 commented 2 years ago

Paragraphs

https://www.theodinproject.com/lessons/foundations-working-with-text#paragraphs)

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Howtocreateparagraphs.html</title>
    </head>
    <body>
         Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
        incididunt ut labore et dolore magna aliqua.

        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
        nisi ut aliquip ex ea commodo consequat.
    </body>
</html>

=> image

When we wrap the text content with a

tag 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Howtocreateparagraphs.html</title>
    </head>
    <body>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
  incididunt ut labore et dolore magna aliqua.</p>

    <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
  nisi ut aliquip ex ea commodo consequat.</p>
    </body>
</html>

=> image

fluffy0301 commented 2 years ago

[Headings] (https://www.theodinproject.com/lessons/foundations-working-with-text#headings)

can differ text's size form <h1>-<h6> 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Headings.html</title>
    </head>
    <body>
        <h1>This is a heading 1</h1>
        <h2>This is a heading 2</h2>
        <h3>This is a heading 3</h3>
        <h4>This is a heading 4</h4>
        <h5>This is a heading 5</h5>
        <h6>This is a heading 6</h6>
    </body>
</html>

image

fluffy0301 commented 2 years ago

[Strong Element]

:The element makes text bold.

(https://www.theodinproject.com/lessons/foundations-working-with-text#strong-element)

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Strong_Element.html</title>
    </head>
    <body>
        <strong>Lorem ipsum dolor</strong>
    </body>
</html>

image

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Strong_Element.html</title>
    </head>
    <body>
         <p>Lorem ipsum <strong>dolor sit</strong> amet, consectetur adipiscing elit.</p>
    </body>
</html>

image