HTML学习笔记（1）

VSCode里面 ctrl+/注释

html元素：直接书写html名称，不需要<>，按回车即可

1、span标签

文本标签 

<span style="color: red;">hello</span>
<span>demo</span>

2、h1~h6标签

标题标签

<h1>标题标签</h1>
<h1>标题标签</h1>
<h2>标题标签</h2>
<h3>标题标签</h3>
<h4>标题标签</h4>
<h5>标题标签</h5>
<h6>标题标签</h6>

3、div标签

竖着布局的标签

    <div>竖着布局的标签</div>
    <div>竖着布局的标签</div>
    <div>竖着布局的标签</div>
    <div>竖着布局的标签</div>

4、p标签

段落标签

    <p>段落标签</p>
    <p>段落标签</p>
    <p>段落标签</p>
    <p>段落标签</p>

5、a标签

超链接标签

<!-- target设置资源打开窗口的方式 _blank新窗口打开 _self本窗口打开  -->
<a href="https://www.baidu.com" target="_blank">点击跳转</a>

6、img标签

<!-- src图片资源的地址
    绝对路径 访问资源与被访问资源的关系
    相对路径 被访问资源的绝对地址
    alt 如果没有成功访问src指向的图片资源，则现实alt中的内容
-->
<img src="" alt="这是一个猫咪图片">

7、列表标签

<!-- 列表标签 -->
<ul>
    <li>列表标签</li>
    <li>列表标签</li>
    <li>列表标签</li>
    <li>列表标签</li>
</ul>

8、table标签   

<!-- 表格标签
    tr 行
    td 单元格 th 加粗居中
    thead 头 tfoot 脚 tbody 身子
    border 边框
    cellspacing 单元格之间的距离
    cellpadding 设置单元格填充度
-->
<table border="1" cellspacing="0">
    <tr>
        <td>id</td>
        <td>name</td>
        <td>age</td>
        <td>sex</td>
    </tr>
    <tr>
        <td>id</td>
        <td>name</td>
        <td>age</td>
        <td>sex</td>
    </tr>
    <tr>
        <td>id</td>
        <td>name</td>
        <td>age</td>
        <td>sex</td>
    </tr>
</table>

9、窗口标签

<!-- 窗口标签 -->
<!-- 嵌套资源
    frameborder 不要边框
-->
<iframe src=""></iframe>

 10、换行标签

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>