概念：

　　CSS列表属性允许你放置、改变列表标志，或者将图像作为列表项标志

属性 描述
list-style 简写列表项
list-style-image 列表项图像
list-style-position 列表标志位置
list-style-type 列表类型 
 <!--index.html-->

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Title</title>

     <link rel="stylesheet" type="text/css" href="style.css">

 </head>

 <body>

     <ul class="style-image">

         <li>苹果</li>

         <li>苹果</li>

         <li>苹果</li>

         <li>苹果</li>

     </ul>

     <p>看一下效果</p>

     <ul class="ul1">

         <li>苹果</li>

         <li>苹果</li>

         <li>苹果</li>

         <li>苹果</li>

     </ul>

     <ul class="ul2">

         <li>苹果</li>

         <li>苹果</li>

         <li>苹果</li>

         <li>苹果</li>

     </ul>

 </body>

 </html>
 /*style.css*/

 .style-image{

     /*list-style-type: armenian;*/

     list-style-image: url("1.JPG");

 }

 .ul1{

     list-style-position: inside;

 }

 .ul2{

     list-style-position: outside;

 }

三、CSS样式——列表的更多相关文章

  1. 3月22日 html(三)css样式表

    CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确,但是可重用性差,冗余较多. 例 ...

  2. WEB入门三 CSS样式表基础

    学习内容 Ø        CSS的基本语法 Ø        CSS选择器 Ø        常见的CSS样式 Ø        网页中3种使用CSS的方式 能力目标 Ø        理解CSS的 ...

  3. Java 新手学习 CSS样式列表 排版 格式布局

    1,样式表分为  内联样式表   内嵌样式表  外部样式表  三种. 内联样式表是直接写在标签里面的  比如 <p style=“”></p>  <div style=& ...

  4. 前端学习笔记--CSS样式--列表和表格

    1.列表 2.表格 odd:奇数  even:偶数

  5. 【代码笔记】Web-CSS-CSS样式列表(url)

    一,效果图. 二,代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  6. 学习笔记 第八章 使用CSS美化列表

    第8章  使用CSS美化列表 8.1 列表的基本结构 在HTML中,列表结构可以分为两种基本类型:有序列表和无序列表.使用标签如下: <ul>...</ul>:标识无序列表: ...

  7. java：HTML（table表格，ul列表）和CSS（导入.css文件，三种定义颜色方式，三种样式选择器，a标签属性顺序，）

    1.重点掌握: html: 1.form表单:input,checkbox,seelct,radio,button,submit 2.table表格:thead-->tr-->th;tbo ...

  8. HTML基础（三）——css样式表

    CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确, ...

  9. PHP.9-HTML+CSS（三）-CSS样式

    CSS样式 CSS是Cascading Style Sheets的简写,它除了可以轻松设置网页元素的显示位置和格式处,甚至还能产生滤镜,图像淡化,网页淡入淡出的渐变效果.CSS就是要对网页的显示效果实 ...

随机推荐

  1. DataBase——Mysql的DataHelper

    源帖 https://www.cnblogs.com/youuuu/archive/2011/06/16/2082730.html 保护原帖,尊重技术,致敬工匠! using System; usin ...

  2. angular6 导出json数据到excal表

    1 首先使用npm下载插件依赖的安装包   npm install file-saver --save   npm install xlsx --save   2 引入项目中的ts文件中   impo ...

  3. java自定义注释

    一.什么是注释 说起注释,得先提一提什么是元数据(metadata).所谓元数据就是数据的数据.也就是说,元数据是描述数据的.就象数据表中的字段一样,每个字段描述了这个字段下的数据的含义.而J2SE5 ...

  4. 自学java_Struts2框架

    一.Struts2基础 1.Struts2是有Apache在Struts1和Webwork的基础上研发出的新一代MVC框架. 2.Struts2开发环境的搭建: 打开https://struts.ap ...

  5. ES6的一些知识学习

    一.基础 ES6 - 类: class A{ constructor(name,color){ this.name = name; this.color = color; } toString(){ ...

  6. 2019南昌邀请赛 L 计算几何 G(待补)

    #include<bits/stdc++.h> const double PI=acos(-1.0); ; using namespace std; struct Point { doub ...

  7. Sql 无法解决 equal to 运算中 "Chinese_PRC_CI_AS" 和 "Chinese_PRC_90_CI_AI" 之间的排序规则冲突

    导致问题原因为创建时,表所使用的排序规则不一致 解决办法: 在对比条件后增加 collate Chinese_PRC_90_CI_AI 的转义即可 如: where test1.FieldName = ...

  8. Demystify Git

    Git虽然很时髦,但是不好学,不好用. 关键是不好理解. 本文用最通俗易懂又直观的方式,帮助大家理解git, git的内部组织, 基本概念,还有常用 的工作流程. 本文来自墙外. 习某某说:" ...

  9. vim中制表符tabstop用法

    设置tabstop成为其它值可能会导致文件在其它地方出现错误有四种主要方法使用tabs在vim里: 1.总是保持tabstop=8,设置softtabstop=4.shiftwidth=4(或3.或任 ...

  10. Asteroids 爆破彗星

    发售年份 1979 平台 街机 开发商 雅达利(Atari) 类型 射击 https://www.youtube.com/watch?v=WYSupJ5r2zo