li样式不显示使用overflow:hidden导致Li前面点、圈等样式不见

时间:2022-01-10 22:02:02

点评:用了overflow:hidden 会影响 list-style,即当ul 中的li 的overflow 为hidden的时候,list-style不起作用,不显示前面的点、圈等样式,在ul或li内加入样式:list-style-position: inside; 即可

实际上用了overflow:hidden 会影响 list-style,即当ul 中的li 的overflow 为hidden的时候, list-style不起作用,不显示前面的点、圈等样式。

解决办法:在ul或li内加入样式:list-style-position: inside; 即可。注意适当调节padding位置使之最适合。

列表的样式: 
disc : CSS1 实心圆 
circle :CSS1 空心圆 
square :CSS1 实心方块 
decimal :  CSS1 阿拉伯数字 
lower-roman :  CSS1 小写罗马数字 
upper-roman : CSS1 大写罗马数字 
lower-alpha : CSS1 小写英文字母 
upper-alpha : CSS1 大写英文字母 
none : CSS1 不使用项目符号 
armenian : CSS2 传统的亚美尼亚数字 
cjk-ideographic:CSS2 浅白的表意数字 
georgian : CSS2 传统的乔治数字 
lower-greek :  CSS2 基础的希腊小写字母 
hebrew : CSS2 传统的希伯莱数字 
hiragana : CSS2 日文平假名字符 
hiragana-iroha: CSS2 日文平假名序 
katakana : CSS2 日文片假名字符 
katakana-iroha: CSS2 日文片假名序号 
lower-latin : CSS2 小写拉丁字母 
upper-latin : CSS2 大写拉丁字母 
*list-style-image: url(images/disc.gif); 用图像disc.gif代替列表项目显露 
*list-style-position : outside | inside 
outside:  列表项目标记放置在文本以外,且围绕文本不根据标记对齐 
inside :  列表项目标记放置在文本以内,且围绕文本根据标记对齐

li样式不显示使用overflow:hidden导致Li前面点、圈等样式不见的更多相关文章

  1. td内容自动换行 ,td超过宽度显示点点点… , td 使用 overflow:hidden 无效,英文 数字 不换行 撑破div容器

    我们可以先给表格 table上 固定一个宽度 不让表格撑破 width: 747px; table-layout:fixed; 然后我们在td上加上如下样式 style="width:100 ...

  2. overflow: hidden用法,不仅仅是隐藏溢出

    overflow:hidden是大家常用到的CSS样式,但是大多数人对这个样式的理解仅仅局限于隐藏溢出,而对于清除浮动这个含义不是很了解. <!DOCTYPE html> <html ...

  3. 关于overflow&colon; hidden&semi;的一个诡异问题

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

  4. overflow&colon;hidden的用法

    overflow:hidden是大家常用到的CSS样式,但是大多数人对这个样式的理解仅仅局限于隐藏溢出,而对于清除浮动这个含义不是很了解. <%@ Page Language="C#& ...

  5. css中overflow&colon;hidden的属性 可能会导致js下拉菜单无法显示

    css中overflow:hidden属性导致ExtJS中无法显示下拉滚动条 overflow属性: visible 默认.内容不会被修剪,会呈现在元素之外. hidden 内容会被修剪,但是浏览器不 ...

  6. border-radius导致overflow&colon;hidden失效问题。

    如果一个父元素设置了overflow:hidden属于的同时还设置了border-radius属性,那么如果想隐藏超出的子元素,四个圆角处会出现超出圆角依然显示的bug: 一种方法是运用-webkit ...

  7. &lbrack;Web 前端&rsqb; inline-block元素设置overflow&colon;hidden属性导致相邻行内元素向下偏移

    cp from : https://blog.csdn.net/iefreer/article/details/50421025 在表单修改界面中常会使用一个标签.一个内容加一个修改按钮来组成单行界面 ...

  8. 当鼠标hover的时候,使用tip将overflow&colon;hidden隐藏的文字显示完全

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. overflow&colon;hidden清楚浮动的影响

    在网页布局中有时会遇到这种情况: 如果左边用<dt>,右边用<dd>,放在一行显示,<dt>要设置float:left,这个应该都知道,问题是,第一行这样做没有问题 ...

随机推荐

  1. bootstrap双日历插件实例化

    网站中难免会用到日期选择插件,常见的有jquery的,也有bootstrap的.单日历的就不说了,实例化都比较简单.今天给大家介绍一下bootstrap的双日历插件. http://www.jq22. ...

  2. JavaScript 返回值

    Window.Open()返回值: 利用window.open(‘NewWindow.html’):打开新的窗口NewWindow.html后,如果有返回值需要处理,应通过window.opener. ...

  3. leetcode007&period; Reverse Integer

    /* a good way to predict overflow * each time *10 must predict int overflow * not only the last time ...

  4. easy ui 下拉级联效果 ,下拉框绑定数据select控件

    html代码: ①两个下拉框,一个是省,另一个市 <tr> <td>省:</td> <td> <select id="ProvinceI ...

  5. ES5-ES6-ES7&lowbar;解构赋值

    解构赋值的概念 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring) 传统对变量赋值的方式,以前,为变量赋值,只能直接指定值. var a = 1; ...

  6. java 三目运算符

    三目运算符 可以内嵌使用. level=(input>90)?"Class A":(input>60)?"Class B":"Class ...

  7. CodeForces - 669D Little Artem and Dance 想法题 多余操作

    http://codeforces.com/problemset/problem/669/D 题意:n个数1~N围成一个圈.q个操作包括操作1:输入x, 所有数右移x.操作2:1,2位置上的数(swa ...

  8. 如何判断SSD盘

    1.判断cat /sys/block/*/queue/rotational的返回值.如果返回1则表示磁盘可旋转,可以判断是HDD:反之,如果返回0,则表示磁盘不可以旋转,就有可能是SSD. 注意:/s ...

  9. postgresql数据库备份和恢复(超快)

    PostgreSQL自带一个客户端pgAdmin,里面有个备份,恢复选项,也能对数据库进行备份 恢复(还原),但最近发现数据库慢慢庞大的时候,经常出错,备份的文件过程中出错的几率那是相当大,手动调节灰 ...

  10. 「P4994」「洛谷11月月赛」 终于结束的起点(枚举

    题目背景 终于结束的起点终于写下句点终于我们告别终于我们又回到原点…… 一个个 OIer 的竞赛生涯总是从一场 NOIp 开始,大多也在一场 NOIp 中结束,好似一次次轮回在不断上演.如果这次 NO ...