【视频+图文详解】HTML基础4-html标签的基本使用

图文教程

html标签的基本使用

无序列表

**作用:**定义一个没有顺序的列表结构

由两个标签组成<ul> 以及**<li>(** 两个标签都属于容器级标签,其中ul只能嵌套li标签,但li标签能嵌套任何标签,甚至ul标签**)**

**ul:**ulordered list(无序列表)

**li:**list item(列表项)

基本使用格式:

html 复制代码
<h2>古典四大名著</h2>

<ul>

    <li>三国演义</li>

    <li>西游记</li>

    <li>红楼梦</li>

    <li>水浒传</li>

</ul>

有序列表

**作用:**定义一个有序列表的列表结构

需要两个标签:<ol>和<li>标签

**ol:**ordered list(有序列表)

ol内部只能嵌套li标签,而li标签内部可以嵌套任何标签包括ol标签(跟ul基本一致)

定义列表

**作用:**定义一个自定义标题和内容的列表结构

**组成:**dl,dt,dd

**dl:**definition list 表示创建一个自定义列表结构

**dt:**definition term 表示创建一个自定义主题

**dd:**defination description 表示对前面主题的描述说明

示例

html 复制代码
<h2>国内女明星</h2>

<dl>

    <dt>杨幂</dt>

    <dd>作品:《三生三世》、《宫》、《仙剑奇侠传》等</dd>


    <dt>赵丽颖</dt>

    <dd>作品:《花千骨》、《楚乔传》、《陆贞传奇》等</dd>


    <dt>刘诗诗</dt>

    <dd>作品:《步步惊心》、《仙剑奇侠传》、《女医明妃传》等</dd>

</dl>

注意:dd标签内也可以嵌套许多标签

视频教程

哔哩哔哩(B站)搜索框中输入"uid=3546393096489381"即可

用户:star010_

相关推荐
wl85118 分钟前
Vue 入门到实战 七
前端·javascript·vue.js
Enti7c36 分钟前
用 HTML、CSS 和 JavaScript 实现抽奖转盘效果
前端·css
LCG元40 分钟前
Vue.js组件开发-使用Vue3如何实现上传word作为打印模版
前端·vue.js·word
doubt。1 小时前
2.[网鼎杯 2020 朱雀组]phpweb
网络·安全·web安全·网络安全·php·代码复审
dal118网工任子仪1 小时前
94,【2】buuctf web [安洵杯 2019]easy_serialize_php
android·前端·php
大模型铲屎官2 小时前
HTML5 技术深度解读:本地存储与地理定位的最佳实践
前端·html·html5·本地存储·localstorage·地理定位·geolocation api
程序猿编码2 小时前
自定义命令执行器:C++中命令封装的深度探索(C/C++实现)
linux·c语言·c++·网络安全·shell·命令行
一 乐2 小时前
基于vue船运物流管理系统设计与实现(源码+数据库+文档)
前端·javascript·数据库·vue.js·spring boot·后端·船运系统
m0_528723812 小时前
在React中使用redux
前端·javascript·react.js
神秘剑客_CN3 小时前
使用windows笔记本让服务器上网
运维·服务器·windows