一,效果图。

二,代码。

<!DOCTYPE html>
<html> <head>
<meta charset="utf-8">
<title>CSS 样式列表(url)</title>
<style>
ul.a {
list-style: circle;
} ul.b {
list-style: square;
} ol.c {
list-style: upper-roman;
} ol.d {
list-style: lower-alpha;
} ul {
list-style: none;
padding: 0px;
margin: 0px;
} ul li {
background-image: url(sqpurple.gif);
background-repeat: no-repeat;
background-position: 0px 5px;
padding-left: 14px;
}
</style>
</head> <body>
<p>example of unordered</p>
<ul class="a">
<li>coffee</li>
<li>tea</li>
<li>coca coca</li>
</ul>
<ul class="b">
<li>coffee</li>
<li>tea</li>
<li>coca coca</li>
</ul>
<p>example of ordered lists:</p>
<ol class="c">
<li>coffee</li>
<li>tea</li>
<li>coco coco</li>
</ol>
<ol class="d">
<li>coffee</li>
<li>tea</li>
<li>cocoa cocoa</li>
</ol>
<ul>
</ul>
</body> </html>

参考资料:《菜鸟教程》

【代码笔记】Web-CSS-CSS样式列表(url)的更多相关文章

  1. css select 样式列表-----另一种样式列表

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org ...

  2. CSS select样式列表-------美化列表

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. 【代码笔记】iOS-plist获得城市列表

    一,工程图. 二,代码. - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the ...

  4. WEB前端开发CSS基础样式全面总结

    Web前端开发css基础样式全面总结 颜色和单位的使用 颜色 用颜色的名字表示颜色,比如:red 用16进制表示演示 比如:#FF0000 用rgb数值表示颜色,rgb(红,绿,蓝),每个值都在0-2 ...

  5. Python学习笔记整理总结【web基础】【web/HTML/CSS/JavaScript/DOM/jQuery】

    一.HTML HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记).相当于定义统一的一套规则,大家都来遵守他,这样就可以 ...

  6. CSS Ul(列表样式)

    CSS Ul(列表样式) CSS列表属性作用如下: 设置不同的列表项标记为有序列表 设置不同的列表项标记为无序列表 设置列表项标记为图像 一.列表 在HTML中,有两种类型的列表: 无序列表 - 列表 ...

  7. html+css+javascript实现列表循环滚动示例代码

    使用html+css+javascript实现列表循环滚动,设置时间定时,在规定的时间内替换前一个节点的内容,具体示例如下,感兴趣的朋友可以参考下 说明:设置时间定时,在规定的时间内替换前一个节点的内 ...

  8. css中的列表样式

    在网页设计中,我们经常将某些具有相似功能的标签放在同一组中,这时我们经常会用到列表标签(无序列表ul,有序列表ol),在列表标签中对列表样式的设计可以使我们的页面得到一定程度的美化. 在css中对列表 ...

  9. [CSS3]学习笔记-CSS基本样式讲解

    1.CSS样式-背景 CSS运行应用纯色作背景,也允许使用背景图像创建相当复杂的效果 <!DOCTYPE html> <html> <head lang="en ...

随机推荐

  1. SQLite异常 qAdmin: Cannot perform this operation on a closed dataset.【申明:来源于网络】

    SQLite异常 qAdmin: Cannot perform this operation on a closed dataset. 当使用 SQLite administrator,打开SQLit ...

  2. ubuntu 16.04卸载不必要默认安装软件

    两个办法,一个在ubuntu软件里一个一个删,明显的windows下做法. 还有一个通过终端来删除.ctrl+alt+t打开终端. 1.卸载libreoffices(要删一起删了,然后去装office ...

  3. Python科学计算基础包-Numpy

    一.Numpy概念 Numpy(Numerical Python的简称)是Python科学计算的基础包.它提供了以下功能: 快速高效的多维数组对象ndarray. 用于对数组执行元素级计算以及直接对数 ...

  4. MySQL 的分页查询 SQL 语句

    MySQL一般使用 LIMIT 实现分页.基本语句为: SELECT ... FROM ... WHERE ... ORDER BY ... LIMIT ... 在中小数据量的情况下,这样的SQL足够 ...

  5. [Swift]LeetCode64. 最小路径和 | Minimum Path Sum

    Given a m x n grid filled with non-negative numbers, find a path from top left to bottom right which ...

  6. [Swift]LeetCode981. 基于时间的键值存储 | Time Based Key-Value Store

    Create a timebased key-value store class TimeMap, that supports two operations. 1. set(string key, s ...

  7. Identity Server 4登陆后返回登录前页面

  8. This relative module was not found:

    晚上项目敲完,关机睡觉!  早上醒来-----打开项目,惊呆了 !This relative module was not found: 如图   这个报错,我当时怎么也没看懂!!!   后来经过测试 ...

  9. Android--MediaPlayer高级

    前言 之前博客里已经将了MediaPlayer的简单应用,如何使用MediaPlayer在Android应用中播放音频.这篇博客在MediaPlayer使用的基础上,讲解一下MediaPlayer的一 ...

  10. Lucene 06 - 使用Lucene的Query API查询数据

    目录 1 Query对象的创建(方式一): 使用子类对象 1.1 常用的Query子类对象 1.2 常用的Query子类对象使用 1.2.1 使用TermQuery 1.2.2 使用NumericRa ...