HTML（I）

作者: Sharalyn | 来源:发表于2018-03-14 21:38 被阅读0次

HTML Anatomy

elements

element.PNG

body

<body>
</body>

Only content inside the opening and closing body tags can be displayed to the screen.

structure

<body>
  <p>This paragraph is a child of the body</p>
</body>

the <p> element is nested inside the <body> element.The <p> element is considered a child of the <body> element, the parent.

headings标题

In HTML, there are six different headings, or heading elements.
headings elements ordered from largest to smallest in size.<h1> <h2> <h3> <h4> <h5> <h6>

Divs

<divs> is short for "division"
Remember to always add two spaces of indentation when you nest elements inside of <div>s for better readability.

attributes

Attributes are made up of the following two parts:

The name of the attribute
The value of the attribute

Dispalying text

Paragraphs (<p>) contain a block of plain text.
<span> contains short pieces of text or other HTML. They are used to separate small pieces of content that are on the same line as other content.

Styling text

The <em> tag emphasizes text, while the <strong> tag highlights important text.
The <em> tag will generally render as italic emphasis.
The <strong> will generally render as bold emphasis.

Line breaks

<br> only is composed of starting tag.

Unordered lists

unordered list tagul

<ul>
  <li>Limes</li>
  <li>Tortillas</li>
  <li>Chicken</li>
</ul>

Ordered list

<ol>
  <li>Preheat the oven to 350 degrees.</li>
  <li>Mix whole wheat flour, baking soda, and salt.</li>
  <li>Cream the butter, sugar in separate bowl.</li>
  <li>Add eggs and vanilla extract to bowl.</li>
</ol>

Images

<img src="image-location.jpg />

The <img> tag has a required attribute called src. The src attribute must be set to the image's source, or the location of the image. In this case, the value of src must be the uniform resource locator (URL) of the image. A URL is the web address or local address where a file is stored.

Image Atls

<img src="#" alt="A field of yellow sunflowers" />

Videos

the <video> tag requires a src attribute with a link to the video source.

<video src="myVideo.mp4" width="320" height="240" controls>
  Video not supported
</video>