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. Java语言的9个主要特性

    Java作为时下很流行的一门编程语言,受到很多人的热爱,那么它有哪些特性呢?一起来看看吧. 1.Java语言是简单的 Java语言的语法与C语言和C++语言很接近,使得大多数程序员很容易学习和使用.另 ...

  2. JDBC相关知识

    一.连接数据库 1. 步骤 //1.创建一个Driver实现类的对象 Driver driver = new com.mysql.jdbc.Driver();//注意抛异常 //2.准备 url 和 ...

  3. 纯 CSS 实现波浪效果！

    一直以来,使用纯 CSS 实现波浪效果都是十分困难的. 因为实现波浪的曲线需要借助贝塞尔曲线. 而使用纯 CSS 的方式,实现贝塞尔曲线,额,暂时是没有很好的方法. 当然,借助其他力量(SVG.CAN ...

  4. docker~save与load的使用

    回到目录 对于没有私有仓库来说,将本地镜像放到其它服务器上执行时,我们可以使用save和load方法,前者用来把镜像保存一个tar文件,后台从一个tar文件恢复成一个镜像,这个功能对于我们开发者来说还 ...

  5. FZU 2256 迷宫

    https://vjudge.net/problem/FZU-2256 题意:略 思路: 在比赛的时候想到了一次dfs,一次bfs但是样例都过不了...赛后才知道,距离的更新必须同步,不能先把时光机的 ...

  6. SpringMVC配置实例

    一.SpringMVC概述 MVCII模式实现的框架技术 Model--业务模型(Biz,Dao...) View--jsp及相关的jquery框架技术(easyui) Contraller--Dis ...

  7. [server]nginx 一系列命令

    h1. 启动 nginx -c /usr/local/etc/nginx/nginx.conf h1. 停止 nginx -s stop h1. reload nginx -s reload h1.

  8. ML（1）--概念理解

    机器是如何模拟人来学习的? 人:  observations===>learning===>skill 人从出生开始经过大量的观察(也可能经过身边的的指导)进行学习然后得到相应的技能(比如 ...

  9. Linux文件系统，ntfs分区显示只读文件系统，提示超级快损坏

    背景:某天当我打开自己的设备,突然发现ntfs分区无法写入任何文件,提示为只读文件系统,具体现象如下: 修复过程:排除权限问题,使用fsck进行修复无果后,使用e2fsck进行修复 显示超级快损坏,这 ...

  10. salesforce零基础学习（七十七）队列的实现以及应用

    队列和栈简单的区别为栈是后进先出,队列是先进先出.队列也是特殊的线性表,所以队列也分为顺序存储结构和链式存储结构.本篇主要描述顺序存储结构. 我们先假定一个队列里有5个元素,当我们添加新元素时,添加到 ...