在创建列表的时候，可以通过指定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. [JAVA] HTTP请求,返回响应内容，实例及应用

    JDK 中提供了一些对无状态协议请求(HTTP )的支持,下面我就将我所写的一个小例子(组件)进行描述: 首先让我们先构建一个请求类(HttpRequester ). 该类封装了 JAVA 实现简单请 ...

  2. 【Android 界面效果41】Matrix 与 ColorMatrix

    Matrix: 简单用法就是直接使用它的setXX()方法 而高级一点来理解他就是去理解一个线性矩形 首先我们来认识线性矩形:(用画图粗略地画不要见怪) 分析: 那还有一组 MRERSP_0 MRER ...

  3. ReentrantLock类的基本结构

    ReentrantLock类是一个可重入互斥锁,它具有与使用synchronized()方法和语句访问隐式监视器锁相同的基本行为和语义,但是它的功能更强大.ReentrantLock由最近成功获得锁但 ...

  4. Java学习笔记——JDK1.7的新特性。

    1,switch中可以使用字串 Java代码: String s = "test"; switch (s) { case "test" : System.out ...

  5. web前端开发（1）

    web标准 结构标准.样式标准.行为标准分离 结构标准:xml xhtml  html 样式标准:css 行为标准:DOM  ECMAScript 符合标准的网页:1.标签小写  2.属性加引号 3. ...

  6. mysql_DML_update

    update  表名  set  字段=XX where....;(记得加条件不安全改了) 多个字段: update  表名  set  字段1=XX,字段2= where....;(记得加条件不安全 ...

  7. spring--事务原理

    Spring支持以下7种事务传播行为. 传播行为 XML文件 propagation值 含义 PROPAGATION_REQUIRED REQUIRED 表示当前方法必须在一个具有事务的上下文中运行. ...

  8. Spring学习总结三——SpringIOC容器三

    一:spring容器自动装配注入 为了减少xml中配置内容,可以使用自动装配注入,代替setter注入,只需要在 bean对象配置中添加属性autoWire即可,那么在类中就会自动扫描setXXX() ...

  9. WingIde的快捷键

     tab:自动补全    Alt+1:打开所有折叠    Alt+2:折叠所有classes    Alt+3:折叠所有函数和类    Alt+Backspace:删除光标所在单词的光标前的部分    ...

  10. SPOJ 7758. Growing Strings AC自动机DP

    Growing Strings 题目:给出n个字符串,问最多能够选出多少个串组成序列,并满足前一个字符串是后一个字符串的子串. 分析: AC自动机经典水题... 考虑每个节点结尾时,他能够选出最多的串 ...