html怎么改无序图标,​css怎么设置无序列表?css的列表样式总结

2023-11-12

css怎么样设置无序列表的样式你知道吗?这里有无序列表的详细应用,去掉这些图标之类的,还介绍了去掉小圆点给添加的图片的介绍,大家可以自己试试看。现在就让我们一起来看看这篇文章吧

首先我们先来看看无序列表:我们都知道无序列表通常都是使用小圆点代替的,但是有些时候用小圆点不好看,为了增加美观性,在css样式中有几种样式设计的方法第一种:当然是无序列表中的默认小圆点

第二种:是把小圆点改为小方块显示

第三种:是把小圆点改为空心圆显示

第四种:是把小圆点给去掉,这个应该是比较常用的。

第五种:也是不太常用的,就是把无序列表编程有序列表的方法,前面加数字

现在我们来看看关于css这五种样式的完整代码:

PHP中文网

.zhe1{list-style-type:disc;}

.zhe2{list-style-type:square;}

.zhe3{list-style-type:circle;}

.zhe4{list-style-type:none;}

.zhe5{list-style-type:decimal;}

  • 我是默认小圆点
  • 我是小方块
  • 我是空心圆
  • 我是没有标记的
  • 我是要有序列表

这是一个比较简单的代码了,我们先来看看在浏览器中的显示效果吧:

8886e465661fff0542ec99737d5bd265.png

这五种效果全部显示出来了。是不是很简单呢。(想看更多css样式的知识,就到PHP中文网css参考手册栏目学习)

现在我们来说说css对列表样式的总结:list-style-image:url图片地址 属性使用图像来替换列表项的标记;

list-style-position 属性设置在何处放置列表项标记;还有一个inside的值:放在文本以内。

list-style 复合写法

这个的最后一种是现在比较常用的,如果你不想写太多代码的话,可以使用这种符合写法,简单的完成这些我们看个实例:

.zhe1,.zhe2,.zhe3,.zhe4,.zhe5{list-style:none;}

这个css样式,加上这个,就能去掉那些不想要的东西了,还能写入别的属性,就这个我们来看看效果吧:

82b3091426e4fbfd0fcc522a51c626b8.png

效果就是很明显了是不是,我们就这样把这些列表都去掉了,当然这只是最基础的符合写法,还能写入别的属性样式,这样才能显示节省更多的时间。

好了,以上就是本篇关于css列表样式的总结了。以问题的可以在下方提问。

【小编推荐】

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

html怎么改无序图标,​css怎么设置无序列表?css的列表样式总结 的相关文章

  • Python的multiprocessing连接池

    author skate time 2014 10 13 Python的multiprocessing连接池 root skatedb55 more pool2 py usr bin env python encoding UTF 8 Au
  • the importance of a sense of community responsibility(六级真题批改网90分)

    What proves universally acknowledged is that a sense of community has caused widespread pubic attention Undoubtedly comm
  • 跨省市跳槽,社保公积金处理办法

    文章目录 前言 五险一金断缴行为分析 1 养老保险 2 医疗保险 3 工伤 失业 生育保险 4 公积金 一 方案一 二 方案二 三 方案三 总结 前言 跨省市跳槽五险一金总共有三种处理办法 此处以 武汉跳槽深圳举例 1 直接放弃武汉账户不管
  • 笔记本玩逆水寒服务器未响应,运行逆水寒电脑崩溃怎么办_逆水寒运行游戏时电脑崩溃问题解决指引_游戏吧...

    部分笔记本在运行逆水寒游戏时会出现崩溃现象 许多玩家都不知道该怎么办 如何解决这个问题 下面玩家宝宝们就和游戏吧小编一起来看一看 逆水寒 运行游戏时电脑崩溃问题解决指引吧 逆水寒 运行游戏时电脑崩溃问题解决指引 亲爱的自在同门大家好 近日
  • Android native 层用OpenGL ES在屏幕模拟流水灯

    Android native 层用OpenGL ES在屏幕模拟流水灯 Native C开发OpenGL 源码实现如下 Native C开发OpenGL 参照Android开机动画 自己实现了在native层模拟led流水灯的代码 Andro
  • matinal:SAP 批量修改主数据(客户、供应商、物料)【给所有SAP业务顾问】

    TCODE MASS 对于批量修改主数据如客户 供应商等 可以试用一下Mass 它所能修改的范围如下 选定要修改的对象后 点击运行 会要求选择需要修改的表和字段 然后填写过滤出要修改数据的条件 随后会显示所有需要修改的数据 可以在下方表格里
  • C++字符串的查找

    关于字符串的各种查找 原文出处 https www cnblogs com yongpan p 7920165 html 1 find函数 在字符串中查找子字符串中出现的位置 函数最终返回的是子字符串出现在字符串中的起始下标 该函数有两个参
  • NLP之BERT和GPT

    NLP之BERT和GPT杂谈 我们介绍了好几种获取句子表征的方法 然而值得注意的是 我们并不是只对如何获取更好的句子表征感兴趣 在评估他们各自模型性能的时候所采取的方法 回过头去进行梳理 发现 无论是稍早些的 InferSent 还是 20
  • musescore 构建入门

    musescore 1 QT上面开发 2 Qt由于版本更新 更新到QT6了 构建器由qmake 更换到cmake musescore 在QT是用cmake 构建桌面软件包 3 底层依赖库 几乎都是音频相关的库 下面是windows 系统下面
  • 求无冲突矢量集合

    在PRNET中 i发送的分组能被j正确接收的充要条件是 1 存在i j的链路 2 当i发送时 没有其他节点k发送 即不存在k j 广播形式的也算 3 i发给j时 j只处于接收状态 即j不能发给其他节点 除了上述这些原则 还有一些在做题的时候
  • Linux Ubuntu apt-get安装mysql

    自从转前端以后好久都没有和数据库打过交道了 最近在写一个node项目需要用到mysql 但是又不想在本地安装数据库 就想着在云服务器上安装了 网上百度了安装方法 大多都是去mysql官网下载官方编译好的二进制文件 这个至少都是几百M大小的安
  • 用BeanFactoryAware接口,用BEAN的名称来获取BEAN对象

    用BeanFactoryAware接口 用BEAN的名称来获取BEAN对象 applicationContext beans xml
  • Docker----Dockerfile中执行pip install 命令报 Failed to establish a new connection 错误的解决办法

    原文链接 Docker Dockerfile中执行pip install 命令报 Failed to establish a new connection 错误的解决办法 问题 在Dockerfile文件中通过RUN pip install
  • 计算机视觉2021年3月28最新论文

    编辑 AI速递 计算机视觉 3月28日 1 USB Universal Scale Object Detection Benchmark 标题 USB 万能物体检测基准 链接 https arxiv org abs 2103 14027 2
  • Connected to the target VM, address:XXXX, transport: socket

    问题 1 Connected to the target VM address 127 0 0 1 65604 transport socket 排查方案 我是最近半年多次遇到这个问题 这个就是用debug模式启动程序 方便调试 运行一半直
  • Ablation Study消融研究

    作者 飘哥 链接 https www zhihu com question 291655038 answer 683038545 来源 知乎 著作权归作者所有 商业转载请联系作者获得授权 非商业转载请注明出处 术语 消融研究 通常用于神经网
  • Python解释器验证器工具类

    需求背景 现需要实现一个工具类 功能为验证给定路径是否为有效的 Python 解释器可执行文件 不一定是主程序所使用的解释器 并获取该解释器版本信息 是否安装某模块 包等信息 该工具类将赋予主程序类似 PyCharm 中选取 Python
  • C#的架构、框架、设计模式

    建立层务必使用类库选项 不要使用文件夹 没错 说的就是我自己 一 两层架构 1 架构概述 两层架构适合小型 中小型项目 名称 标识 用途 数据访问对象 DAL 模型服务 需要添加Models引用 实体对象 Models 模型 用户界面 UI
  • SpringMVC @RequestBody 自动转json Http415错误

    项目中想用 RequestBody直接接收json串转成对象 网上查了使用方法 看着非常简单 不过经过测试很快发现页面直接报415错误 h1 HTTP Status 415 h1 hr size 1 p b type b Status re

随机推荐

  • React的几种路由配置方法

    1 标签 常用 import IndexRoute from react router const Dashboard React createClass render return div Welcome to the app div R
  • python内置array模块,与numpy中的array和list之间的转换

    numpy中matrix类型与array类型的转换 如何让 M matrix 1 2 3 4 如何转变为 array 1 2 3 4 比较优雅的办法 x matrix arange 12 reshape 3 4 gt gt gt x mat
  • 全国计算机等级考试题库二级C操作题100套(第76套)

    第76套 给定程序中 函数fun的功能是 计算下式前n项的和作为函数值返回 例如 当形参n的值为10时 函数返回 0 204491 请在程序的下划线处填入正确的内容并把下划线删除 使程序得出正确的结 果 注意 源程序存放在考生文件夹下的BL
  • 使用Fiddler修改请求参数

    1 下载比较新版的Fiddler 2 进入到调试的页面 并填写好参数 以获取短信验证码接口为例 3 先清空Fiddler列表中已经存在的请求 以便观察 4 打开断点调试 下面两种方式都可以 F11是快捷键 按F11 键盘快捷键 或者如下图勾
  • Qt在嵌入式系统QNX的HMI应用方案

    author 锋影 扣扣 174176320 e mail 174176320 qq com 黑莓推出了其全新的黑莓10平台QT的智能手机和平板电脑 它产生了大量的兴趣在QT上移动 黑莓10是基于QNX1操作系统的黑莓 也许不是很出名 是Q
  • lightGBM 调参

    文章目录 1 概述 1 lgb cv函数使用方法 1 参数 2 param需要填写的参数 2 GridSearchCV调参 第一步 学习率和迭代次数 第二步 确定max depth和num leave 第三步 确定min data in l
  • Mac配置与下载安卓SDK,配置adb命令

    所以如果想要单独下载SDK 参考如下步骤 文章目录 配置步骤 1 首先需要安装java的JDK 2 解压上面下载好的文件 3 补充SDK内容 4 配置环境变量 5 测试adb命令 其他信息 配置步骤 1 首先需要安装java的JDK 首先登
  • Linux查看磁盘空间

    如何查看磁盘空间 1 查看内存空间 dever iZ2zeewvm4yos65shrzg3wZ free total used free shared buff cache available Mem 7724300 1528996 300
  • vue项目的webpack打包优化

    前言 我第一次从搭建项目环境 到打包准备上线测试 vue对开发者来说学习成本不高 带来了很多的便利 没有经过如何优化 直接打包出来 打开页面时就看到无尽的加载中 啥 是网络不好了 等了半分钟时间页面终于出现了 我第一次打包 所以百度做功课
  • Xilinx IP核手册阅读——FIFO

    目录 Introduction Ch 1 Overview Feature Summary Native FIFO Interface Signals Applications Native FIFO Applications Ch 2 P
  • 笔记本电脑销量排名_2020最佳笔记本电脑品牌公布!华硕第一,戴尔惠普分列二三名_搜狐汽车...

    本文车型速览 除了文章作者的主观观点外 我们正尝试基于全网可查的客观数据 为您提供中立 客观的参考依据 本文部分车型速览 展开 微信扫码 直接一次看完附近所有城市低价 附近城市均有经销商可售卖至本市 2020最佳笔记本电脑品牌公布 华硕第一
  • Java实现http请求访问的实现和处理DefaultHttpClient过期和URL连接格式问题

    Java实现http请求代码 String strUrl http 172 0 0 1 80 api Notifiction sendForbidden userId dhdhsh data shshh try 增加代码下面两行代码解决UR
  • 计算机网络默认网关怎么看,默认网关怎么查看 查看电脑默认网关的方法介绍...

    本机默认网关是什么 默认网关怎么查看 有时我们需要对电脑进行相关设置 此时就要知道默认网关 那么 怎么查看电脑默认网关呢 下面我们就一起去了解一下 默认网关是什么 一个用于 TCP IP 协议的配置项 是一个可直接到达的 IP 路由器的 I
  • STM32控制舵机讲解,从入门到放弃。

    STM32控制舵机 文章目录 STM32控制舵机 前言 一 PWM PWM是什么 如何实现PWM信号输出 二 舵机 什么是舵机 控制原理 参考代码 前言 我们这里拿STM32F103C8T6作为我们的芯片 通过PB9端口输出PWM 实现控制
  • Html5 & C++混和编程

    https github com BlzFans wke
  • nginx 设置匿名http正向代理

    这两天在研究nginx的正向代理 想通过nginx搭建一个http代理服务器 网站找到了这篇文章 http www cnblogs com inteliot archive 2013 01 11 2855907 html 配置 Nginx
  • 链表排序,时间复杂度O(nlogn)

    题目描述 对链表进行排序 要求时间复杂度O nlogn 解题思路 因题目要求复杂第O nlogn 故可以考虑归并排序 1 将待排序数组 链表 取中点并一分为二 2 递归地对左半部分进行归并排序 3 递归地对右半部分进行归并排序 4 将两部分
  • 高斯判别分析matlab实现

    本文基于博客https blog csdn net kwame211 article details 81530766一文 将其改为matlab上的实现 高斯判别分析的推导过程可参见https zhuanlan zhihu com p 38
  • Java基础--重写(Overriding,覆盖)-重载(Overloading)

    多态性 Java的方法重载 就是在类中可以创建多个方法 它们具有相同的名字 但具有不同的参数和不同的定义 调用方法时通过传递给它们的不同参数个数和参数类型来决定具体使用哪个方法 Java的方法重写 就是各子类对父类中的方法可能有其他特殊定义
  • html怎么改无序图标,​css怎么设置无序列表?css的列表样式总结

    css怎么样设置无序列表的样式你知道吗 这里有无序列表的详细应用 去掉这些图标之类的 还介绍了去掉小圆点给添加的图片的介绍 大家可以自己试试看 现在就让我们一起来看看这篇文章吧 首先我们先来看看无序列表 我们都知道无序列表通常都是使用小圆点