1. 无序列表 有序列表 自定义列表

1,无序列表

第一 你不必须有子标签  <li></li>

第二 ul天生自带内外边距

List-style的属性值 circle(空心圆) disc(实心圆)square(正方形)none(空)

2.  有序列表

ol 有序列表

  1. 内部必须有子标签<li>
  2. 天生自带内外边距

Ol和ul不同之处就在前面符号的区别。

用标签属性type修改

3.   自定义列表

Dl 自定义列表 dt 是小标题  dd内容

4.有的标签设置背景时会独占一行,还有的会随着内容的增减而改变自己的空间大小

根据以上现象,标签又分

块级: p h1-h6 div ul li ol dl 等

内敛:span img i b a em icon(矢量标签)

二者区别

块级

1,块级元素会独占一行

2,块级可以设置宽高

内敛

1,内敛不会独占一行

2,内敛不可以设置宽高

3,内敛元素的margin上下不起作用了

二者转换

块级转行级

给块级元素添加属性display:inline; display 显示  inline 行

行级转块级

给行级元素添加属性display:block;    block块

行级块元素

给需要的元素添加属性 display:inline-block;

(可以设置宽高了,可以在一行了,margin可以随便使用了)

列表 ul ol dl 和 块级标签和行及标签之间的转换的更多相关文章

  1. 重要的事情说三遍:列表 ul / ol 等是块级元素,是块级元素,块级元素

    HTML 块级元素 大多数 HTML 元素被定义为块级元素或内联元素. 编者注:“块级元素”译为 block level element,“行内元素”译为 inline element. 块级元素在浏 ...

  2. 列表(ul ol dl)

    Title 1 2 3 1 2 3 a 1 2 b 1 2 <!DOCTYPE html> <html lang="en"> <head> &l ...

  3. html标签的显示模式(块级标签,行内标签,行内块标签)(转)

    html标签的显示模式(块级标签,行内标签,行内块标签)   今天讲课的时候,讲到了html中的标签的显示模式,大致分为块级标签和行内标签.那么初学者在刚使用标签的时候会发现有些属性在一些标签上不起作 ...

  4. 块和内嵌总结,以及各个标签的应用。其中的ul ol dl特殊定义为auto,使得里面的内容展开

    <!doctype html> <html> <head> <meta charset="UTF-8"/> <title> ...

  5. HTML开发之(块级标签,行内标签,行内块标签)

    显示模式的特性: 主要分为两大类: 块级元素:独占一行,对宽高的属性值生效:如果不给宽度,块级元素就默认为浏览器的宽度,即就是100%宽: 行内元素:可以多个标签存在一行,对宽高属性值不生效,完全靠内 ...

  6. HTML基础知识(块级标签,行内标签,行内块标签)

    块级元素:独占一行,对宽高的属性值生效:如果不给宽度,块级元素就默认为浏览器的宽度,即就是100%宽: 行内元素:可以多个标签存在一行,对宽高属性值不生效,完全靠内容撑开宽高! 其中还有一种结合两种模 ...

  7. CSS(3)---块级标签、行内标签、行内块标签

    块级标签.行内标签.行内块标签 html中的标签元素三种类型:块级标签.行内标签.行内块标签. 一.概述 1.块级标签 概念 每个块元素通常都会独自占据一整行或多整行,可以对其设置宽度.高度.对齐等属 ...

  8. 基础复习之HTML (meta标签、块级元素与行内元素)

    一.meta标签 SEO 如何在不使用JS的情况下刷新页面(http-equiv="refresh" , content="time") 设置页面缓存 移动端设 ...

  9. css块级标签,行内标签,行内块标签的转换(2)

            css块级标签,行内标签,行内块标签的转换 版权声明 本文原创作者:雨点的名字 作者博客地址:https://home.cnblogs.com/u/qdhxhz/ 在基础1中,我详细讲 ...

随机推荐

  1. Linux tgtadm: Setup iSCSI Target ( SAN )

    Linux target framework (tgt) aims to simplify various SCSI target driver (iSCSI, Fibre Channel, SRP, ...

  2. Dubbo 源码分析 - 服务引用

    1. 简介 在上一篇文章中,我详细的分析了服务导出的原理.本篇文章我们趁热打铁,继续分析服务引用的原理.在 Dubbo 中,我们可以通过两种方式引用远程服务.第一种是使用服务直联的方式引用服务,第二种 ...

  3. Windows Server 2012 NTP时间同步

    非域环境下有外网连接情况的时间同步 1. 打开组策略,Powershell键入命令:gpedit.msc 2. 在计算机策略对话框中,打开如下路径:计算机配置/管理模板/系统/Windows时间服务/ ...

  4. Django富文本需要添加配置

    TINYMCE_DEFAULT_CONFIG = { 'theme': 'advanced', 'width': 600, 'height': 400, }

  5. 如何编写JQuery 插件详解

    转载自:http://blog.sina.com.cn/s/blog_6154bf970101jam7.html 如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jq ...

  6. KNN算法基本实例

    KNN算法是机器学习领域中一个最基本的经典算法.它属于无监督学习领域的算法并且在模式识别,数据挖掘和特征提取领域有着广泛的应用. 给定一些预处理数据,通过一个属性把这些分类坐标分成不同的组.这就是KN ...

  7. PHP之ThinkPHP框架(会话)

    网页会话即是实现页面跳转及数据传递,在web开发中,Cookie和Session的使用是极其重要的,GET和POST是最常使用的页面间数据传递的方法,相对于PHP脚本基础,在ThinkPHP中对网页会 ...

  8. Java 虚拟机对锁优化所做的努力

    作为一款公用平台,JDK 本身也为并发程序的性能绞尽脑汁,在 JDK 内部也想尽一切办法提供并发时的系统吞吐量.这里,我将向大家简单介绍几种 JDK 内部的 "锁" 优化策略. 1 ...

  9. dedecms中arclist标签做分页以及分页点击模块样式错乱问题

    in 使用织梦建站,通常会调用到一个文章列表,dedecms官网list标签没有提供typeid的属性,首页或多列表部分情况下使用分页并不方便,这就需要用arclist标签实现一个分页功能:以下还是展 ...

  10. 一文让你彻底理解 Java NIO 核心组件

    背景知识 同步.异步.阻塞.非阻塞 首先,这几个概念非常容易搞混淆,但NIO中又有涉及,所以总结一下. 同步:API调用返回时调用者就知道操作的结果如何了(实际读取/写入了多少字节). 异步:相对于同 ...