15天学会HTML和CSS

HTML的知识体系总结

目录

1. HTML的介绍
2. HTML的head标签
3. HTML的body 文本标签
4. HTML的body 列表标签

HTNL的介绍

HTML的head标签

HTML的body 文本标签

1. 标题标签： <h1></h1>到<h6></h6>(块级元素)

• 自带换行，会占一行，所以称为块级元素;
• 标题标签自带换行(</br>)。
• 标签的属性对标签的功能做进一步的补充，可以由开发人员自由定义标签的属性来达到想要的显示效果。例如属性align：文字的位置,值：left right center。

2. 水平线标签：<hr/>(块级元素)
   
   属性：

• width="宽度"，设置水平线的宽度，可以是百分比，也可以是像素；
  
• size="高度"，设置水平线的高度；
• color="颜色"，设置水平线的颜色；
• align 同标题标签

3. 段落标签：<p></p>(块级元素)
   
   会将数据作为一个整体显示，段落之间会换行，并且段落间距比行间距大。
4. 换行符：<br/>
   
   告诉浏览器在这里换行。
5. 空格符：&nbsp
   
   告诉浏览器在这里空格。
6. 加黑标签：<b></b>
   
   会将字体加黑显示。
7. 斜体标签：<i></i>
   
   会将字体以斜体方式显示。
8. 删除标签：<del></del>
   
   会在字体上增加删除线。
9. 下划线标签：<u></u>
   
   会在字体上增加下划线。

以上标签可以嵌套使用，不需要考虑顺序。

HTML的body 列表标签

列表的分类：

• 无序列表(<ul></ul>)
  (块级元素)
  <li></li>表示该列表下的一行，默认数据前方有一个黑圆圈.

//代码示例
<ul>
    <li>列表1</li>
    <li>列表2</li>
    <li>列表3</li>
    
</ul>

• 有序列表(<ol></ol>)(块级元素)
  
  属性：type="排序编号"

//代码示例
<ol type="1">
    <li>列表1</li>
    <li>列表2</li>
    <li>列表3</li>
    
</ol>

• 自定义列表(<dl></dl> <dt></dt> <dd></dd>)(块级元素)

//代码示例
<dl>
    <dt>旅游城市</dt>
    <dd>安庆</dd>
    <dd>黄山</dd>
    <dt>编程语言</dt>
    <dd>java</dd>
    <dd>C++</dd>
    <dd>Python</dd>
</dl>

未完待更 2020-4-1