【广州校区】【原创】html笔记整理 - 黑马程序员技术交流社区

HTML标签不区分大小写，建议使用小写

HTML 文件都是以.html 或者.htm 结尾的，建议使用.html 结尾

标题标签:

h1 ~ h6:逐级变小

[HTML] 纯文本查看 复制代码

<!DOCTYPE html>

    <html>

        <head>

            <meta charset="UTF-8">

            <title>标题标签</title>

        </head>

        <body>

            <h1>title</h1>

            <h2>title</h2>

            <h3>title</h3>

            <h4>title</h4>

            <h5>title</h5>

            <h6>title</h6>

        </body>

    </html>

水平线:
[HTML] 纯文本查看 复制代码
```
<hr/>
```
换行:
[HTML] 纯文本查看 复制代码
```
<br/>
```
段落标签:
[HTML] 纯文本查看 复制代码
```
<p><p/>
```
字体标签:
[HTML] 纯文本查看 复制代码
```
<font><font/>
```
- size:字体大小1~7逐渐增大
- color:字体颜色
- face:字体样式
加粗:
[HTML] 纯文本查看 复制代码
```
<b></b>
```
斜体:
[HTML] 纯文本查看 复制代码
```
<i></i>
```
图片标签:
[HTML] 纯文本查看 复制代码
```
<img src="xxx"/>
```
- src:图片路径
- width:图片宽度
- height:图片高度
- alt:图片加载不出来显示的信息
无序标签:
- type:有3种样式
- ul: unorder list
有序标签:
[HTML] 纯文本查看 复制代码
```
<ol></ol>
```
- type:有7种样式
- reversed:倒叙
- start:起始序号
- ol: order list
超链接:
- :不跳转
- target:_self、_blank
表格标签:
[HTML] 纯文本查看 复制代码
```
<table><tr><td></td></tr></table>
```
- width:表格宽度
- height:表格高度
- border:变宽宽度
- cellspacing:表格间隔
- cellpadding:内部留白
- align:对齐方式
- bgcolor:背景颜色
- rowspan:跨行
- colspan:跨列
- 表格可以嵌套表格
frameset:不能在<body>标签内，用frameset时不用body标签

[HTML] 纯文本查看 复制代码

<!DOCTYPE html>

    <html>

        <head>

            <meta charset="UTF-8">

            <title>框架集标签</title>

        </head>

        <frameset cols="25%,*">

            <frame src="left.html" />

            <frame src="right.html" />

        </frameset>

    </html>

    ```

    

    ```

    <!DOCTYPE html>

    <html>

        <head>

            <meta charset="UTF-8">

            <title>网站后台系统显示页面</title>

        </head>

        <frameset rows="20%,*">

            <frame src="top.html" />

            <frameset cols="20%,*">

                <frame src="left.html" />

                <frame name="right" />

            </frameset>

        </frameset>

    </html>

    

    <!--left-->

    <!DOCTYPE html>

    <html>

        <head>

            <meta charset="UTF-8">

            <title></title>

        </head>

        <body>

            <a href="right.html" target="right">会员管理</a><br /><br />

            <a href="#" target="right">品牌管理</a><br /><br />

            <a href="#" target="right">商品管理</a><br /><br />

            <a href="#" target="right">分类管理</a>

        </body>

    </html>