在创建列表的时候,可以通过指定type来设置列表项的符号,如下所示:

 <body>
<form id="form1" runat="server">
<div>
<%--实心圆--%>
<ul id="ulstyle" type="disc">
<li>jQuery 是一个JavaScript库。 </li>
<li>jQuery 极大简化了JavaScript编程。</li>
<li>jQuery 很容易学习。</li>
</ul> <%--数字--%>
<ul id="ul1" type="decimal">
<li>jQuery 是一个JavaScript库。 </li>
<li>jQuery 极大简化了JavaScript编程。</li>
<li>jQuery 很容易学习。</li>
</ul> <%--数字方块--%>
<ul id="ul2" type="square">
<li>jQuery 是一个JavaScript库。 </li>
<li>jQuery 极大简化了JavaScript编程。</li>
<li>jQuery 很容易学习。</li>
</ul> <%--空心圆--%>
<ul id="ul3" type="circle">
<li>jQuery 是一个JavaScript库。 </li>
<li>jQuery 极大简化了JavaScript编程。</li>
<li>jQuery 很容易学习。</li>
</ul> <%--小写罗马数字--%>
<ul id="ul4" type="lower-roman">
<li>jQuery 是一个JavaScript库。 </li>
<li>jQuery 极大简化了JavaScript编程。</li>
<li>jQuery 很容易学习。</li>
</ul> <%--大写罗马数字--%>
<ul id="ul6" type="upper-roman">
<li>jQuery 是一个JavaScript库。 </li>
<li>jQuery 极大简化了JavaScript编程。</li>
<li>jQuery 很容易学习。</li>
</ul> <%--小写英文--%>
<ul id="ul7" type="lower-alpha">
<li>jQuery 是一个JavaScript库。 </li>
<li>jQuery 极大简化了JavaScript编程。</li>
<li>jQuery 很容易学习。</li>
</ul> <%--大写英文--%>
<ul id="ul8" type="upper-alpha">
<li>jQuery 是一个JavaScript库。 </li>
<li>jQuery 极大简化了JavaScript编程。</li>
<li>jQuery 很容易学习。</li>
</ul> </ul>
</div>
</form>
</body>

效果图:

还有一种就是type="none",即不使用列表符号。

使用自带的符号看起来比较刻板,可以使用jQuery实现自定义的列表符号,并且可以使用图片。

 <head runat="server">
<title></title>
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<style type="text/css">
#ulstyle
{
list-style:none;
}
<%--自定义样式--%>
.list
{
background:url(img/rightrow.jpg) no-repeat;padding-left:20px;
}
</style> <%--jQuery代码--%>
<script type="text/javascript">
$(document).ready(function () {
$("#ulstyle li").each(function () {
$(this).addClass("list");
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<ul id="ulstyle">
<li>jQuery 是一个JavaScript库。 </li>
<li>jQuery 极大简化了JavaScript编程。</li>
<li>jQuery 很容易学习。</li>
</ul>
</div>
</form>
</body>

效果图:

在HTML中通过jQuery设置列表项符号的更多相关文章

  1. CSS:列表样式(设置列表项的标志图案/位置)

    通过CSS 列表属性能够放置.改变列表项标志.或者将图像作为列表项标志. 代码整理自w3school:http://www.w3school.com.cn 效果图: watermark/2/text/ ...

  2. ASP.NET MVC中为DropDownListFor设置选中项的方法

    在MVC中,当涉及到强类型编辑页,如果有select元素,需要根据当前Model的某个属性值,让Select的某项选中.本篇只整理思路,不涉及完整代码. □ 思路 往前台视图传的类型是List< ...

  3. MVC 中@Html.DropDownListFor() 设置选中项 这么不好使 ? [问题点数:40分,结帖人lkf181]

    http://bbs.csdn.net/topics/390867060 由于不知道错误原因在哪 我尽量把代码都贴出来吧:重点是:在 Controller 类里 我给 SelectListItem集合 ...

  4. CSS中列表项list样式

    CSS列表属性 属性 描述 list-style-属性 用于把所有用于列表的属性设置于一个声明中. list-style-image 将图象设置为列表项标志. list-style-position ...

  5. FreeRTOS列表和列表项

    FreeRTOS中的列表和列表项类似于数据结构中的链表和节点: 相关的文件是list.c和list.h两个文件: List_t列表结构体 具体定义如下: /* * Definition of the ...

  6. @Html.DropDownListFor 绑定列表项

    MVC中为 DropDownListFor 绑定列表项, 一种方案从后台加载列表内容,通过ViewData传递到前台页面. View: <div class="editor-label ...

  7. 跟我学SharePoint 2013视频培训课程—— 审批、拒绝列表项(13)

    课程简介 第13天,怎样在SharePoint 2013中审批.拒绝列表项. 视频 SharePoint 2013 交流群 41032413

  8. 从0开始学FreeRTOS-(列表与列表项)-3

    # FreeRTOS列表&列表项的源码解读     第一次看列表与列表项的时候,感觉很像是链表,虽然我自己的链表也不太会,但是就是感觉很像. 在`FreeRTOS`中,列表与列表项使用得非常多 ...

  9. 从0开始学FreeRTOS-(列表&列表项)-6

    # FreeRTOS列表&列表项的源码解读 第一次看列表与列表项的时候,感觉很像是链表,虽然我自己的链表也不太会,但是就是感觉很像. 在FreeRTOS中,列表与列表项使用得非常多,是Free ...

随机推荐

  1. 【Android 界面效果34】Android里Service的bindService()和startService()混合使用深入分析

    .先讲讲怎么使用bindService()绑定服务 应用组件(客户端)可以调用bindService()绑定到一个service.Android系统之后调用service的onBind()方法,它返回 ...

  2. Python_使用smtplib和email模块发送邮件

    [http://blog.csdn.net/menglei8625/article/details/7721746] SMTP (Simple Mail Transfer Protocol) 邮件传送 ...

  3. hdu 4729 树链剖分

    思路:这个树链剖分其实还是比较明显的.将边按权值排序后插入线段树,然后用线段树查找区间中比某个数小的数和,以及这样的数的个数.当A<=B时,就全部建新的管子. 对于A>B的情况比较 建一条 ...

  4. MongoDB - Introduction to MongoDB, MongoDB Extended JSON

    JSON can only represent a subset of the types supported by BSON. To preserve type information, Mongo ...

  5. web性能瓶颈

    1.网络,网络不好,其他做得再好,性能也是问题. 其中包括自己的带宽和请求的数量,带宽是我们无法控制的.我们能做的是尽可能的减少不必要的请求. 2.服务器,一个产品,服务器是关键,所有的请求都要经过服 ...

  6. 【转】DBA需要的技能

         dba掌握的技术    1.      os : linux,solaris或其他unix起码要一种    2.      bash (不精通也要熟)  LINUX与UNIX SHELL编程 ...

  7. JavaScript之动态背景登陆表单

    <!doctype html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  8. ios警告:Category is implementing a method which will also be implemented by its primary class 引发的相关处理

    今天在处理项目中相关警告的时候发现了很多问题,包括各种第三方库中的警告,以及各种乱七八糟的问题  先说说标题中的问题  Category is implementing a method which ...

  9. Objective-C 【Category-非正式协议-延展】

    -------------------------------------------  类别(Category)的声明和实现 实质:类别又叫类目,它其实是对类的一个拓展!但是他不同于继承后的拓展! ...

  10. Codevs 2837 考前复习

     时间限制: 1 s  空间限制: 128000 KB  题目等级 : 黄金 Gold 题解  查看运行结果     题目描述 Description Aiden马上要考试了,可他还没怎么复习,于是他 ...