HTML&CSS基础-无序列表和有序列表

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　作者：尹正杰

版权声明：原创作品，谢绝转载！否则将追究法律责任。

一.HTML源代码

  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="UTF-8">
  5.         <title>无序列表和有序列表</title>
  6.  
  7.         <style type="text/css">
  8.             /**
  9.              *     去掉项目符号
  10.              */
  11.  
  12.     /*        ul{
  13.                 list-style:none;
  14.             }*/
  15.         </style>
  16.     </head>
  17.     <body>
  18.         <!--
  19.             列表就相当于去超时购物时的那个购物清单，在HTML也可以创建列表，在网页中一共有三种列表：
  20.                 1>.无序列表
  21.                 2>.有序列表
  22.                 3>.定义列表
  23.         -->
  24.  
  25.         <!--
  26.             无序列表:
  27.                 使用ul标签开来创建一个无序列表
  28.                 使用li标签在ul标签中创建一个一个的列表项,每一个li标签的内容就是一共列表项
  29.  
  30.             通过type属性可以修改无序列表的项目符号，有以下可选值:
  31.                 disc:
  32.                     默认值，实心的圆点
  33.                 square:
  34.                     实心的方块
  35.                 circke：
  36.                     空心的圆
  37.  
  38.             温馨提示:
  39.                 默认的项目符号我们一般都不使用，都会手动用css去掉默认的项目符号，因为默认的项目符号在Google，Mozilla Firefox，IE实现的大小标准均不统一。
  40.                 如果需要设置项目符号，则可以采用为li设置图片背景的方式来设置。
  41.  
  42.             ul和li都是块元素
  43.         -->
  44.         <ul>
  45.             <li><<西游记>></li>
  46.             <li><<三国演义>></li>
  47.             <li><<水浒传>></li>
  48.             <li><<红楼梦>></li>
  49.         </ul>
  50.  
  51.         <!--
  52.             有序列表和无序列表类似，只不过他使用ol标签来代替ul
  53.             有序列表使用有序的序号作为项目符号
  54.             通过type属性值,可以指定序号的类型，有以下可选值:
  55.                 1:
  56.                     默认值，使用阿拉伯数字
  57.                 a/A:
  58.                     采用小写或大写字母作为序号
  59.                 i/I:
  60.                     采用小写或大写字母的罗马数字作为需要
  61.  
  62.             ol也是块元素。
  63.  
  64.         -->
  65.         <ol type="I">
  66.             <li><<西游记>></li>
  67.             <li><<三国演义>></li>
  68.             <li><<水浒传>></li>
  69.             <li><<红楼梦>></li>
  70.         </ol>
  71.  
  72.         <!--
  73.             列表之间都是可以互相嵌套，可以在无序列表中放一个有序列表，也可以在有序列表中放一个无序列表。
  74.         -->
  75.         <p>菜单</p>
  76.         <ul>
  77.             <li>
  78.                 鱼香肉丝
  79.                 <ol>
  80.                     <li>鱼</li>
  81.                     <li>香</li>
  82.                     <li>肉丝</li>
  83.                 </ol>
  84.             </li>
  85.             <li>
  86.                 宫保鸡丁
  87.                 <ul>
  88.                     <li>宫保</li>
  89.                     <li>鸡丁</li>
  90.                 </ul>
  91.             </li>
  92.             <li>青椒肉丝</li>
  93.         </ul>
  94.     </body>
  95. </html>

二.浏览器打开以上代码渲染结果

python自动化运维之路~DAY4的更多相关文章

  1. 【Python自动化运维之路Day4】

    abs()  取绝对值all()  所有为真,则为真,否则为假any()  至少有一个为真,就为真,否则为假callable()   判断函数是否可以被调用,如果可以返回True,否则返回False ...

  2. python自动化运维之路~DAY5

    python自动化运维之路~DAY5 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.模块的分类 模块,用一砣代码实现了某个功能的代码集合. 类似于函数式编程和面向过程编程,函数 ...

  3. 《Python自动化运维之路》 业务服务监控(二)

    文件内容差异对比方法 使用diffie模块实现文件内容差异对比.dmib作为 Python的标准库模块,无需安装,作用是对比文本之间的差异,且支持输出可读性比较强的HTML文档,与 Linux下的di ...

  4. Python自动化运维之路-01

    python的主要应用 python的擅长领域 学python有没有前途?python的语言排名 语言选择 运维会了开发后可以干什么? python的最大优势就是什么都能做. 课程概述 毕业目标 周五 ...

  5. 【Python自动化运维之路Day9】Socket

    socket也可以认为是套接字是一种源IP地址和目的IP地址以及源端口号和目的端口号的组合.网络化的应用程序在开始任何通讯之前都必须要创建套接字.就像电话的插口一样,没有它就没办法通讯. socket ...

  6. 【Python自动化运维之路Day7】

    1. configparser模块 import configparser config = configparser.ConfigParser() #先把config应用一下configparser ...

  7. 【Python自动化运维之路Day6】

    1.递归思考题,阶乘 使用递归方式(函数)计算: 1*2*3*4*5*6*7*8*9*10的值 def func(num): if num==1: return 1 return num*func(n ...

  8. 【Python自动化运维之路Day2】

    1. 常量命名规则 在Python中,会在变量命名上标明某变量是常量,通常采用全是大写的方式来标明,如: CONNECT= '127.0.0.1' PORT = ' 2.Python编译 python ...

  9. 《Python自动化运维之路》 系统基础信息模块(一)

    系统性能收集模块Psutil 目录: 系统性能信息模块psutil 系统性能信息模块psutil psutil能够轻松实现获取系统运行的进程和系统利用率包括(CPU,内存,磁盘 和网络)等.主要用于系 ...

随机推荐

  1. JavaScript使用jsonp实现跨域

    为什么要把ajax跨域写一下呢,因为ajax跨域并不是想跨就能跨的.因为为了安全,ajax是不允许跨域的. 举个例子,你有一个卖水果的网站,你的ajax请求另一个网站提供的图片,正常的时候,图片是一个 ...

  2. Open Source CRM

    https://www.odoo.com/zh_CN/page/crm 试用: https://none53.odoo.com/web#home https://none.mypscloud.com/ ...

  3. ActiveMQ应用(1)-安装及示例

    简介: Apache ActiveMQ ™ 是最流行最强大的开源消息及继承模式服务器.i Apache ActiveMQ 速度快,支持多种语言的客户端及代理,可便捷的使用企业集成模式,完整支持JMS1 ...

  4. CentOS Mininal 安装VMtools的方法

    1. 下载安装CentOS75 的mininal版本 2. 安装完成之后挂在vmtools. 虚拟机管理,安装vmtools即可 3. ssh登录虚拟机. cd /dev 进入到设备系统 mount ...

  5. Java占位符

    一.背景 在使用java开发的过程中,经常需要使用将字符串拼接到一起(比如,用于日志输出),常用方法如下: 使用+将不同字符串进行拼接 使用StringBuilder 使用String.format ...

  6. Linux基础学习（9）--文件系统管理

    第九章——文件系统管理 一.回顾分区和文件系统 1.分区类型: 2.分区表示方法: 3.文件系统: 二.文件系统常用命令 1.df命令.du命令.fsck命令和dump2fs命令: (1)文件系统查看 ...

  7. PKUWC 2019&WC 2019爆零记

    PKUWC 2019&WC 2019爆零记 毕竟过了很久了,杂七杂八的东西就不写了,并且除成绩之外的内容不保证其正确性. Day1 T1:看到这道题很舒服啊,枚举top序算合法图的数量,状压D ...

  8. BZOJ4998星球联盟——LCT+并查集(LCT动态维护边双连通分量)

    题目描述 在遥远的S星系中一共有N个星球,编号为1…N.其中的一些星球决定组成联盟,以方便相互间的交流.但是,组成 联盟的首要条件就是交通条件.初始时,在这N个星球间有M条太空隧道.每条太空隧道连接两 ...

  9. BZOJ2434[Noi2011]阿狸的打字机——AC自动机+dfs序+树状数组

    题目描述 阿狸喜欢收藏各种稀奇古怪的东西,最近他淘到一台老式的打字机.打字机上只有28个按键,分别印有26个小写英文字母和'B'.'P'两个字母. 经阿狸研究发现,这个打字机是这样工作的: l 输入小 ...

  10. 【Linux】Centos配置ssh无密码登录

    [测试环境] 刚好重新做mgr就搞下吧,主要论文好长~想多做几遍再看~ master1 192.168.13.111 master2 192.168.13.112  master3  192.168. ...