【IDEA】HTML学习(一)-HTML介绍、页面结构、常见标签(文本、无序列表、有序列表、列表嵌套)

2021/7/26 23:05:59

本文主要是介绍【IDEA】HTML学习(一)-HTML介绍、页面结构、常见标签(文本、无序列表、有序列表、列表嵌套),对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

Hyper Text Markup Language : 超文本标记语言

超文本 : 不仅仅是纯文本还包括字体效果和多媒体相关(音频,视频,图片)

xml:可扩展标记语言:

标记语言特点:<开启标签 属性=值>标签体</结束标签>

学习HTML主要学习的就是有哪些标签,以及标签的使用方式

HTML的页面结构:

 <!DOCTYPE html>文档声明 作用:告诉浏览器使用html的哪个版本的标准解析页面 此写法是html5标准
 <html lang="en">根标签
     <head>头标签:此标签里面的内容一般都是给浏览器看的
         <meta charset="UTF-8">设置字符集
         <title>Title</title>设置页面标题
     </head>
     <body>体标签:此标签里面的内容是给用户看的
     </body>
 </html>

常见的标签:

文本相关:

  • h1-h6 : 内容标题

    • 特点 : 独占一行,自带上下间距,字体加粗

  • 段落标签 p:

    • 特点 : 独占一行,自带上下间距

  • 加粗标签 b

  • 斜体标签 i

  • 下划线标签 u

  • 删除线标签 s

无序列表:

 <ul>
         <li>张三</li>
         <li>李四</li>
         <li>王五</li>
 </ul>

有序列表:

 <ol>
         <li>java基础</li>
         <li>API</li>
         <li>数据库</li>
 </ol>

列表嵌套:

 <h3>列表嵌套</h3>
     <!--有序列表和无序列表可以任意无限嵌套-->
     <ul>
         <li>凉菜
             <ol>
                 <li>拍黄瓜</li>
                 <li>花毛一体</li>
             </ol>
         </li>
       <li>炒菜
             <ol>
                 <li>宫保鸡丁</li>
                 <li>木须鸡蛋</li>
             </ol>
        </li>
   </ul>

 



这篇关于【IDEA】HTML学习(一)-HTML介绍、页面结构、常见标签(文本、无序列表、有序列表、列表嵌套)的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程