HTML学习笔记

前端 May 16, 2020

#HTML学习笔记


基本框架

标记

<!DOCTYPE html>
<html lang =“ zh_CN”>
<头>
    <meta charset =“ UTF-8”>
    <meta name =“ viewport” content =“ width = device-width,initial-scale = 1.0”>
    <meta http-equiv =“ X-UA-Compatible” content =“ ie = edge”>
    <title>标题</ title>
</ head>
<身体>
    
</ body>
</ html>

可打开.html文件,直接输入html:5调出

语句

一些规范:

1.标签使用小写,元素必须封闭
2.空元素要加斜杠以闭合 <br />
3.不使用语义化,所有样式都存放于CSS中,内容与样式分离

标记

<!DOCTYPE html>
<html lang =“ zh_CN”>

<头>
    <meta charset =“ UTF-8”>
    <meta name =“ viewport” content =“ width = device-width,initial-scale = 1.0”>
    <meta http-equiv =“ X-UA-Compatible” content =“ ie = edge”>
    <title>标题</ title>
</ head>

<身体>
    <h1>一级标题</ h1>
    <h2>二级标题</ h2>
    <p>起点</ p>

    <!-换行符->
    <br />
    <!-分割线->
    <hr />

    <!-列表,可嵌套->
    <!-有序列表->
    <ol>
        <li>第一项</ li>
        <li>第二项</ li>
    </ ol>
    <!-无序列表->
    <ul>
        <li>第一项</ li>
        <li>第二项</ li>
    </ ul>

    <!-链接->
    <a href="https://www.google.com/">链接显示的文本</a>
    <!-链接到页面特定位置,使用ID特性->
    <a href="#top">返回顶部</a>
    <p id =“ top”>顶部</ p>
    <!-链接到其他页面的特定位置->
    <a href="http://wiki-power.com/#top">导航到站外页面的某个位置</a>

    <!-图像->
    <img src =“ / xx.png” alt =“无法加载时的文字说明” />

    <!-表格->
    <表格>
        <!-第一行->
        <tr>
            <!-第一列->
            <th> </ th>
            <!-第二列->
            <th scope =“ col”>周六</ th>
            <!-第三列->
            <th scope =“ col”>周日</ th>
        </ tr>
        <!-第二行->
        <tr>
            <th scope =“ row”>数量</ th>
            <td> 120 </ td>
            <td> 135 </ td>
        </ tr>
        <!-第三行->
        <tr>
            <th scope =“ row”>收益</ th>
            <!-跨列colspan,跨行rowpan->
            <td colspan =“ 2”> 500 </ td>
        </ tr>
    </ table>

    <!-表单,待补充->
    <!-iframe,待补充->
    <!-flash /视频/音频,待补充->

</ body>

</ html>

参考与致谢

标题 可打开.html文件,直接输入html:5调出 语句 一些规范: 标签使用小写,元素必须封闭 空元素要加斜杠以闭合
不使用语义化,所有样式都存放于CSS中,内容与样式分离 标题

一级标题

二级标题

段落



  1. 第一项
  2. 第二项
  • 第一项
  • 第二项
链接显示的文本 回到顶部

顶部

跳转到站外页面的某个位置 无法加载时的文字说明
周六 周日
数量 120 135
收益 500
知识共享许可协议
本站文章除特别声明外,均采用 知识共享署名 - 非商业性使用 - 相同方式共享 4.0 国际许可协议 进行许可。
您的支持将鼓励我们继续创作!

Power Lin

一个不会讲故事的硬件工程师,不是一个合格的产品经理。

Great! You've successfully subscribed.
Great! Next, complete checkout for full access.
Welcome back! You've successfully signed in.
Success! Your account is fully activated, you now have access to all content.