Web前端第一季(HTML):六:课时 15 : 114-无序列表和有序列表+课时 16 : 115-自定义列表

目录

一.目的

1.想:学习前端知识

2.想:记录笔记,下次不用看视频,直接看笔记就可以快速回忆。

二.参考

1.SIKI学院:我参考此视频实操

1.w3school官网:当做字典使用

1.菜鸟教程:当做字典使用

三.注意

四.操作:1:成功:课时 15 : 114-无序列表和有序列表

1.运行效果:无序列表

1.有序列表

四.操作:1:成功:课时 16 : 115-自定义列表

1.运行结果:


一.目的

1.想:学习前端知识

2.想:记录笔记,下次不用看视频,直接看笔记就可以快速回忆。

二.参考

1.SIKI学院:我参考此视频实操

登录 - SiKi学院 - 生命不息,学习不止!

  1. 我参考此视频实操

1.w3school官网:当做字典使用

w3school 在线教程

1.菜鸟教程:当做字典使用

菜鸟教程 - 学的不仅是技术,更是梦想!

三.注意

四.操作:1:成功:课时 15 : 114-无序列表和有序列表

1.运行效果:无序列表

参考网址

HTML 列表

 

<!DOCTYPE html>
<html>
<head>
	<title>我是标题</title>	
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

</head>
<body>
<ul>ul是无序列表</ul>

<ul type="disc"> 
<li>li是无序列表中每一行,type="disc"是符号为实心圆</li>
<li>我</li>
<li>是</li>
<li>x</li>
<li>z</li>
<li>y</li>
</ul>

<ul type="circle"> 
<li>li是无序列表中每一行,type="disc"是符号为空圆</li>
<li>我</li>
<li>是</li>
<li>x</li>
<li>z</li>
<li>y</li>
</ul>

<ul type="square"> 
<li>li是无序列表中每一行,type="disc"是符号为方形</li>
<li>我</li>
<li>是</li>
<li>x</li>
<li>z</li>
<li>y</li>
</ul>
</body>
</html>

HTML 列表

 

1.有序列表

<!DOCTYPE html>
<html>
<head>
	<title>我是标题</title>	
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

</head>
<body>
<ol>ul是无序列表</ol>

<ol> 
<li>li是有序/无序列表中每一行,默认从1开始</li>
<li>我</li>
<li>是</li>
<li>x</li>
<li>z</li>
<li>y</li>
</ol>

<ol start="10"> 
<li>默认从start开始</li>
<li>我</li>
<li>是</li>
<li>x</li>
<li>z</li>
<li>y</li>
</ol>

<ol start="10" type="a"> 
<li>type="a"序号类型是字母,type="1"序号类型是数字,从start字母开始,</li>
<li>我</li>
<li>是</li>
<li>x</li>
<li>z</li>
<li>y</li>
</ol>

<ol start="1" type="i"> 
<li>type="i"序号类型是罗马数字,从小写开始,从start字母开始,</li>
<li>我</li>
<li>是</li>
<li>x</li>
<li>z</li>
<li>y</li>
</ol>

<ol start="1" type="I"> 
<li>type="I"序号类型是罗马数字,从大写开始,从start字母开始,</li>
<li>我</li>
<li>是</li>
<li>x</li>
<li>z</li>
<li>y</li>
</ol>


</body>
</html>

 

四.操作:1:成功:课时 16 : 115-自定义列表

1.运行结果:

<!DOCTYPE html>
<html>
<head>
	<title>我是标题</title>	
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

</head>
<body>

<p>dt:自定义列表</p>
<p>dd:自定义列表里面的项</p>
<dl>
<dt>水果</dt>
<dd>苹果</dd>
<dd>香蕉</dd>
<dd>橘子</dd>
</dl>

<dl>
<dt>运动</dt>
<dd>打乒乓球</dd>
<dd>打篮球</dd>
<dd>踢足球</dd>
</dl>

</body>
</html>

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值