02-前端学习-html

HTML文档

  • 所有的HTML文档必须使用文档类型声明开始:<!DOCTYPE html>。
  • HTML文档本身开头和结尾。
  • HTML文档的可见部分之间和。
    1
    2
    3
    4
    5
    6
    7
    <!DOCTYPE html>
    <html>
    <body>
    <h1>My First Heading</h1>
    <p>My first paragraph.</p>
    </body>
    </html>

HTML标题

  • HTML标题。
    1
    2
    3
    <h1>This is heading 1</h1>
    <h2>This is heading 2</h2>
    <h3>This is heading 3</h3>

HTML段落

1
2
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

HTML链接

  • 链接的目标是在指定的href属性。
    1
    <a href="https://www.w3schools.com">This is a link</a>

HTML图像

  • HTML图像与定义的标签。源文件(src),可替代文本(alt), width和height被设置为属性:
    1
    <img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">

HTML按钮

  • HTML按钮标签:
    1
    <button>Click me</button>

HTML列表

  • HTML列表与定义ul(无序/符号列表)或ol(有序/编号列表)标签,其次是li标签(列表项):
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    <!DOCTYPE html>
    <html>
    <body>

    <h2>An Unordered HTML List</h2>

    <ul>
    <li>Coffee</li>
    <li>Tea</li>
    <li>Milk</li>
    </ul>

    <h2>An Ordered HTML List</h2>

    <ol>
    <li>Coffee</li>
    <li>Tea</li>
    <li>Milk</li>
    </ol>

    </body>
    </html>

HTML元素

1
2
3
#左右两边是成对标签:<tagname>Content goes here...</tagname>
#有些HTML标签忘记写结尾标签,不影响使用,但建议补全:<p>This is a paragraph
#空HTML元素<br>

HTML属性

  • HTML属性给元素信息进行补充。
  • 属性经常写在开始的tag里, w3schools标准建议使用双引号。
属性名称 释义
herf 超链接
src 引用图像位置
alt 图像无法显示时的文字说明
style 颜色、字体大小等
lang 定义语言
title 将鼠标悬停在段落上时,title属性的值将显示为工具提示。
  • 总结一下:
    • All HTML elements can have attributes
    • The title attribute provides additional “tool-tip” information
    • The href attribute provides address information for links
    • The width and height attributes provide size information for images
    • The alt attribute provides text for screen readers
    • At W3Schools we always use lowercase attribute names
    • At W3Schools we always quote attribute values with double quotes

html元信息

  • 元数据通常定义文档标题,字符集,样式,链接,脚本和其他元信息。

html样式

  • Use the style attribute for styling HTML elements
  • Use background-color for background color
  • Use color for text colors
  • Use font-family for text fonts
  • Use font-size for text sizes
  • Use text-align for text alignment

HTML文本格式元素

-------------本文结束感谢您的阅读-------------