文章速览:

HTML基础知识的学习+附加常用HTML标签

HTML中有序列表(<ol><li>)和无序列表(<ul><li>)以及定义列表的使用,以及利用无序列表制作网购按钮

HTML中图片的网页插入以及属性设置

HTML中<a></a>标签的四大功能 必看!必看!!必看!!!

HTML表单标签<form></form>登录窗口和单选框以及下拉栏的制作


有序列表(

  1. )的使用:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body>你们喜欢看的电影:<ol><li>速8</li><li>返老还童</li><li>marvel</li></ol></body></html>

其中的ol代表列表夹,li代表的是列表项
结果:
对与上面写的难免感觉有些简单,其实ol标签中有5种值可以进行添加,然后就可以更加美观

对于上面的代码中等价于:

<body>你们喜欢看的电影:<ol type="1"><li>速8</li><li>返老还童</li><li>marvel</li></ol></body>

当然,对于上面的type=”1“而言,也可以将1换成a、A、i、I

换成a的话,按照a、b、c进行编号的排序

换成A的话,按照A、B、C进行编号的排序

换成 i 的话,按照 i 、 ii 、 iii 进行编号排序

换成 I 的话,按照 I 、 II 、 III 进行编号排序

<body>你们喜欢看的电影:<ol type="1" reversed="reversed"><li>速8</li><li>返老还童</li><li>marvel</li></ol></body>

换成上面的代码的话就会进行倒叙的排序

<body>你们喜欢看的电影:<ol type="1" start="2"><li>速8</li><li>返老还童</li><li>marvel</li></ol></body>

换成上面的代码的话就会从第二个开始排序,第一个就没了

type=“1” start=“2”,无论类型是1,还是a、A、i、I,要是想从第二个开始的话,都需要start为2


无序列表(

  • )的使用:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body>你们喜欢吃的水果:<ul><li>苹果												

HTML中有序列表(<ol><li>)和无序列表(<ul><li>)以及定义列表的使用,以及利用无序列表制作网购按钮相关推荐

  1. 使用ul li和不适用ul li的区别

    在制作使用ul li和不适用ul li的区别 1.使用ul li会使其中的内容和使用p标签一样,是一个块级元素,会使内容自动分行,使用后它的内容的内边距距离边框较远 2.不适用ul li标签,内容是行 ...

  2. html怎么实现单个li效果,基于DIV+ul+li实现的表格(多示例)

    普通的显示数据的时候,ul就是项目列表,li就是列表项.可以用来显示数据.如果用于DIV+CSS布局的话,ul+li可以替换表格的作用,具体的设置,如果宽度高度.行间距.背景边框等需要配合CSS一起设 ...

  3. div内li标签间距_html ul li 横排 间距

    怎么通过CSS来修改UL里LI之间的行间距呢? 怎么通过CSS来修改UL里LI之间的行间距呢? . 使用css语句:line-height 通过设置不同的line-height值得到不同间距. 代码: ...

  4. html ul li 行显示li 间距,[ 求助 ] 让ul li缩小行间距的CSS代码是什么?

    我在网页中插入如下一段RSS阅读器代码: 复制内容到剪贴板 代码: Subscribe to RSS headline updates from: Powered by FeedBurner 可是保存 ...

  5. HTML上的ul li标签消除,去掉ul li 前面的点与空白(div+css)

    如果直接在网页用 ul li 标签,默认情况下有一个小黑点,并且每个li前面还有一段空白,尤其是li中包括图片的情况.为什么会出现这种情况?ul li 是 html 中的列表标签,所以默认每个li前面 ...

  6. html让ul的li自动居中,css ul li导航菜单居中问题解决方法

    昨晚群里一个朋友帮忙解决的问题,之前没有遇到过,题目如下: 不改变html结构,使导航菜单垂直水平居中,导航宽度自适应屏幕100%,高度30px;单项高度28px,宽80px; 兼容:ie6+,ff, ...

  7. html li内文字垂直居中,ul li 下图片文字垂直居中

    html代码如下: 首页 cqm8@163.com +86 898 234566 对应的css代码如下: .contact ul li { float: left; display: inline; ...

  8. html无序列表怎么加上小圆点,ul li html无序列表标签组学习

    属于无序列表组合标签-是html列表标签组合. html网页代码经常使用ul li列表机关标签. ul li 一.不能撮合 ul下只能放li标签,li标签内可以纵脱何标签,虽然也大要在li内再放ul ...

  9. ul 原点显示_web前端开发学习教程,CSS HTML - ul li列表原点如何相连

    原标题:web前端开发学习教程,CSS HTML - ul li列表原点如何相连 目前我列出两个方案,很详细,希望可以帮助到有疑问的朋友. 方案一: html 参与考试<第一期模拟考试> ...

最新文章

  1. 设计模式之抽象工厂模式学习笔记
  2. 《树莓派渗透测试实战》——总结
  3. 蒙特卡洛模拟预测股票_使用蒙特卡洛模拟来预测极端天气事件
  4. java电子商务源码解读 b2b2c o2o
  5. [原]openstack-kilo--issue(十八) Error parsing template file: Template format version not found.
  6. 努力和拼尽全力之间,到底差了什么
  7. flex布局最后一行左对齐的处理
  8. 第四季 word vba
  9. 【精选】Java高频面试题278道附答案,通关中大型互联网企业工程师必备
  10. 小程序方法-小程序获取上一页的数据修改上一个页面的数据
  11. 【软件工程基础】数独生成器以及解答器
  12. 抗衰落技术 — Rake接收和发射分集
  13. C# worksheet设置Excel样式
  14. PTA习题 计算某年某月某日是该年中的第几天
  15. 群晖安装Calibre(含格式转换豆瓣元数据推送kindle)221211
  16. 43. 盘点那些必问的数据结构算法题之二叉树基础
  17. win7TTS修复,使用C#SpeechSynthesizer 类
  18. 使用EditPlus替换文件中的某一字符为换行符
  19. 【运筹学】对偶理论 : 互补松弛性 ( 原问题与对偶问题标准形式 | 互补松弛定理 | 互补松弛定理示例说明 )
  20. go环境搭建开发工具安装配置

热门文章

  1. PHP代码中的情话,[php发送短信验证码代码]php发送短信验证码
  2. 为什么推荐使用Ubuntu 18.04 LTS学习机器人操作系统ROS 1和2
  3. 记美团iOS实习面试总结
  4. Omniverse Audio2Face 角色转换 3D模型模仿真实发音
  5. Win7共享WIFI iPhone上网无鸭梨
  6. 【Vue2 组件间数据的双向绑定】
  7. 前端开发工程师 职业规划
  8. 在VMware 虚拟机(Win7)中还原真机Ghost备份的Win10系统
  9. 最好的硬盘数据恢复软件是哪个
  10. 加密、解密、加签、验签专题