ITMO-Study-Note

网编主页/HTML 相关知识

超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用来结构化 Web 网页及其内容的标记语言。网页内容可以是:一组段落、一个重点信息列表、也可以含有图片和数据表格。

HTML 由一系列元素组成

这个元素的主要部分有:

  1. 开始标签(Opening tag):包含元素的名称(本例为 p),及一对包围名称的尖括号。这表示元素从这里开始或者开始起作用——在本例中即段落由此开始。
  2. 结束标签(Closing tag):与开始标签相似,只是其在元素名之前包含了一个正斜杠。这表示元素到这里结束——在本例中即段落在此结束。初学者常常会犯忘记添加结束标签的错误,这可能会产生一些奇怪的结果。
  3. 内容(Content):元素的内容,本例中就是所输入的文本本身。
  4. 元素(Element):开始标签、结束标签与内容相结合,便是一个完整的元素。

标题标签+标签之段落和水平线

  1. <h(x)>标题</h(x)>
    h(x) 表标题,x 为 1-6 之间的数字,表示标题的级别。
    另外有简洁表达形式:h$*6 直接给出六个形式的标题。
  2. <p>文本</p>
    p 表段落
  3. <hr />
    hr 表在HTML页面中创建水平线
    (其中在该语句中可以添加水平线的属性,例如:color、size、width等)
  4. <br>
    br 表换行
    <p>What is HTML? <br> Idk</p>
  5. <body> </body>
    body 表内容区域

标签之图片

<img src="图片路径" alt="图片描述" width="宽度" height="高度" />
src 表图片路径,alt 表图片描述(替代文本),width 表图片宽度,height 表图片高度,title 表鼠标悬停在图片上给予提示。


标签之链接

<a href="链接地址(url)">链接文本</a>
该语句下,可以添加嵌套语句,如:

<a href="http://www.baidu.com">
    <img src="baidu.png" alt="百度logo" width="100" height="100" />
</a>

标签之文本

常见文本标签

  1. <b>加粗文本</b>
  2. <i>斜体文本</i>
  3. <u>下划线文本</u>
  4. <em>定义着重文字
  5. <strong>定义加重语气
  6. <del>定义删除字
  7. <span>元素没有特定的含义
  8. <strike>删除线文本</strike>
  9. <sup>上标文本</sup>
  10. <sub>下标文本</sub>
  11. <code>计算机代码文本</code>
  12. <pre>预格式化文本</pre>
  13. <blockquote>引用文本</blockquote>
  14. <q>短引用文本</q>
  15. <cite>作品名称</cite>
  16. <em>强调文本</em>
  17. <strong>重要文本</strong>
  18. <small>小号文本</small>
  19. <big>大号文本</big>
  20. <dfn>定义文本</dfn>
  21. <abbr>缩写文本</abbr>
  22. <time>日期文本</time>
  23. <var>变量文本</var>
  24. <body>文档主题元素</body>
  25. <section>通用部分元素</section>
  26. <div>内容划分元素</div>

列表标签之有序列表

Type属性:

  1. 1 表示列表项目用数字标号
  2. a 表示列表项目用小写字母标号
  3. A 表示列表项目用大写字母标号
  4. i 表示列表项目用罗马数字标号
  5. I 表示列表项目用大写罗马数字标号

列表是可以嵌套的

<oi>
    <li>第一项</li>
    <li>
        <oi>
            <li>睡觉</li>
            <li>吃饭</li>
        </oi>
    </li>
</oi>

HTML 形式 表单


文档对象模型(DOM)