ul、li列表样式部分如下:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>列表样式</title>

    <style>

        ul.ul1{

            /*list-style常用值:decimal数字

                               circle空心圆

                               disc实心圆，系统默认*/

            list-style-image: url("../../image/icon.png");

            /*outside偏向外侧*/

            list-style-position: outside;

        }

        ul.ul2{

            list-style-image: url("../../image/icon.png");

            /*inside偏向内侧*/

            list-style-position: inside;

        }

    </style>

</head>

<body>

<ul class="ul1">

    <li>柠檬</li>

    <li>苹果</li>

    <li>香蕉</li>

</ul>

<ul class="ul2">

    <li>柠檬</li>

    <li>苹果</li>

    <li>香蕉</li>

</ul>

</body>

</html>

css基础知识之列表的更多相关文章

  1. HTML+CSS基础知识（2）选择器的使用、盒子模型的讲解、列表的使用

    文章目录 1.CSS基础知识 2.css样式 2.1.代码: 2.2 测试结果 3.CSS的语法 3.1 代码 4.块元素和行内元素 4.1 代码 4.2 测试结果 5.常用的选择器 5.1 代码块 ...

  2. 〖前端开发〗HTML/CSS基础知识学习笔记

    经过一天的学习,把慕课网的HTML/CSS基础知识学完了,笔记整理: 1. 文件结构: HTML文件的固定结构: <html> <head>...</head> & ...

  3. CSS基础知识筑基

    01.CSS 简介 CSS 指层叠样式表 (Cascading Style Sheets),对HTML网页内容进行统一外观样式设计和管理,给网页进行各种装饰,让她变得美观,是HTML的化妆师.(Cas ...

  4. 前端开发：css基础知识之盒模型以及浮动布局。

    前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西?  为什么这个浮动没有效果?  这个问题楼主已经回答了n遍.今天则是把 ...

  5. CSS基础知识之float

    前段时间写过一篇CSS基础知识之position,当时对float的理解不太准确,被慕课网多名读者指出(原文已修正,如有误导实在抱歉).现对float进行更深入的学习,在此把学习心得分享给大家. 浮动 ...

  6. (转)第一天　XHTML CSS基础知识 文章出处：标准之路(http://www.aa25.cn/div_css/902.shtml)

    欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还是称之为web标准. 学习本系列教程需有一定html和css基础,也 ...

  7. CSS基础知识之position

    最近在慕课网学习了 网页布局基础 和 固定层效果 ,都是由声音甜美的 婧享人生 老师所录制,视频详细讲解了CSS中position的用法,在此把学习笔记分享给大家. CSS定位机制 标准文档流(Nor ...

  8. 【CSS】 CSS基础知识 属性和选择

    css基础知识 html的基本标签都是千篇一律的,为了能够个性化外观,就需要进行样式的调整,而css就是专门用来维护,管理样式的一种格式.在html中定义css有三种方法 1. 为标签添加style属 ...

  9. CSS基础知识01

    一.CSS基础知识介绍 1.css是cascading style sheet层叠式样式表的简写 2.css小用法 加粗:font-weight:bold;             正常用:norma ...

随机推荐

  1. 部分转载[C#性能优化实践]

    全文出处:http://www.infoq.com/cn/articles/C-sharp-performance-optimization 1.性能 主要指两个方面:内存消耗和执行速度.性能优化简而 ...

  2. 流畅python学习笔记：第十章：序列的修改，散列和切片

    前面在介绍了类的很多内置方法,比如__add__,__eq__,这里继续介绍类的两个内置方法,这2个内置方法可以将一个类实例变成一个序列的形式.代码如下 class vector(object):   ...

  3. 列表的系列操作（python）

    除了定义和切片外,这里总结下系列的操作: # hanbb come on! names = ["hbb",'tian','bao','cheng'] #Add names.appe ...

  4. UDP和多线程服务器

    UDP: UDP是数据报文传输协议,这个传输协议比较野蛮,发送端不需要理会接收端是否存在,直接就发送数据,不会像TCP协议一样建立连接.如果接收端不存在的话,发送的数据就会丢失,UDP协议不会去理会数 ...

  5. vue.js移动端app实战1：初始配置

    本系列将会用vue.js2制作一个移动端的webapp单页面,页面不多,大概在7,8个左右,不过麻雀虽小,五脏俱全,常用的效果如轮播图,下拉刷新,上拉加载,图片懒加载都会用到.css方面也会有一些描述 ...

  6. 学习笔记TF030:实现AlexNet

    ILSVRC(ImageNet Large Scale Visual Recognition Challenge)分类比赛.AlexNet 2012年冠军(top-5错误率16.4%,额外数据15.3 ...

  7. Docker进阶使用1

    容器间共享文件 Docker 的容器和外部环境是相对隔离的,并且容器是一次性的,运行结束后并不会有任何的持久化的文件或者数据.所以当我们需要做应用数据的持久化,或者保留应用的日志文件时,我们需要用到 ...

  8. TCP/IP协议之ping和traceroute

    Ping程序就是调用的就是ICMP报文.利用的是ICMP的应答和回显请求.来看下具体的ping报文. Request的报文类型为8 Reply的类型为0 通过具体的ping报文可以看到ping报文的大 ...

  9. HDU - 4995 - Revenge of kNN

    题目链接 : https://vjudge.net/problem/HDU-4995 题目大意  :   读入n个点的坐标与该点所拥有的值val,进行m次查询,对于每一次查询,读入该点的坐标,计算离该 ...

  10. 华为软件开发云对比Jenkins-JavaWeb项目持续部署方式

    一.前言:Jenkins介绍 Jenkins是一个开源软件项目,是基于Java开发的一种持续集成工具,用于监控持续重复的工作,旨在提供一个开放易用的软件平台,使软件的持续集成和持续部署变成可能. 本文 ...