标签: html-lists
css list inline不是水平列出项目？
我不知道为什么这个显示不正确,列表是水平显示的？而是垂直显示!
这是我的代码:
#stats li {
display: inline;
list-style-type: none;
padding-right: 20px;
}<ul id="stats">
<li>
<h1>53</h1>
</a>
</li>
<li>
<h1>67</h1>
</a>
</li>
</ul>推荐指数
解决办法
查看次数
HTML5 UL LI可拖动
我有一个无序列表:
- 清单项目1
- 清单项目2
- 清单项目3
- 清单项目4
- 清单项目5
使用此代码实现:
<ul>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
<li>List item 4</li>
<li>List item 5</li>
</ul>
现在,我希望它可以拖延.例如,如果我向上拖动"列表项目5",我可以将它放在"列表项目2"和"列表项目3"之间,它将成为第三个.
我想在没有jQuery的情况下这样做,只需简单的Javascript.另外,我想使用原生HTML5 draggable ="true".任何帮助,将不胜感激.
推荐指数
解决办法
查看次数
按下向下箭头按下列表项
我正在创建一个自定义的自动建议框,我需要li按下箭头按下的项目.
所以我将tabindex属性添加到li它正在获得焦点.但问题是它以一些随机高度向上滚动div,它从div中选择了li.
向下箭头键后:
按下一些向下箭头键后:
之后它会离开屏幕,而鼠标按下则表现完美.
在这里我
首先点击了一个Demo JSFiddleitem1,然后按向下箭头它表现相同.
推荐指数
解决办法
查看次数
按值属性定位列表项
正如我最近了解到的,在HTML5中,您可以将value属性与列表项一起使用,只要它们位于有序列表中即可.http://dev.w3.org/html5/markup/li.html
我一直试图按照它们的值来设置列表项的样式.我最好喜欢这样的风格:
li[value >= "10"] { background: orange; }
li[value >= "20"] { background: green; }
但是,目前只有CSS才能实现这一点.
这是一个我一直在玩的小提琴,尝试不同的东西.http://jsfiddle.net/Hf57v/2/
HTML:
<ol>
<li value="33"></li>
<li value="4"></li>
<li value="12"></li>
<li value="88"></li>
<li value="jadfk"></li>
</ol>
CSS:
li { width: 20px; height: 20px; margin: 20px; background: gray; }
li[value~="3"] { background: orange; } /* #1 */
li[value="4"] { background: red; } /* #2 */
li[value="12"] { background: blue; } /* #3 */
li[value^="1"] { background: green; } /* #4 */
li[value^="8"] { background: …推荐指数
解决办法
查看次数
CSS导致UL在IE中缩进太多
我在页面顶部有一个导航栏.在FF和Chrome中,导航栏显示正常.然而在IE8中(有或没有兼容性),UL似乎从左侧缩进,而不是每个li只是整个li; 尽管声称
text-align:center; width:600px; margin:auto; padding-left:0;
可能导致这种情况的任何想法？
推荐指数
解决办法
查看次数
ListItem光盘显示在垂直底部
我的页面上有几个未排序的列表.两个列表都使用list-style: disc inside;.每个列表的列表项都有几个div.问题是列表项的内容占用多行,并且光盘垂直出现在多行列表项的底部.
这是一个屏幕截图,显示了我遇到的问题.请注意,我从类似的问题中偷走了图像,它不是我的HTML或CSS.
这是我的HTML的条纹版本:
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="billing_form">
<div id="purchase_items">
<h2>Your purchase</h2>
<h4>Items:</h4>
<div class="items">
<ul>
<li>
<div class="item">First Product - one year license</div>
<div class="price">$99.00 USD</div>
</li>
<li>
<div class="item">Second product & 3 year Product Plan</div>
<div class="price">$125.00 USD</div>
</li>
</ul>
</div>
<div class="subtotal">SUBTOTAL: $224.00 USD</div>
<h4>Discounts:</h4>
<div class="discount">
<ul>
<li>
<div class="item">A really long discount item name - with extra info on three lines!</div>
<div …推荐指数
解决办法
查看次数
使用javascript对html列表进行排序
我有一组三个列表项,我想在页面加载时从高到低自动显示.理想情况下使用jquery或javascript.
<ul class="list">
<li id="alpha">32</li>
<li id="beta">170</li>
<li id="delta">28</li>
</ul>
每个列表项都需要自己的ID,因为它们每个都有单独的背景图像.数字必须是文本节点,以便用户可以编辑它们.
推荐指数
解决办法
查看次数
从下到上<ul>元素排列
我试图找出如何强制元素从底部开始到顶部.
我已经搜索了stackoverflow,我似乎无法得到我需要的答案.这张图应该解释一下:
这也应该有所帮助:
<?php require("connectdb.php"); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery Dynamic Drag'n Drop</title>
<script type="text/javascript" src="javascript/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="javascript/jquery-ui-1.7.1.custom.min.js"></script>
<script type="text/javascript" src="javascript/jquery.ui.ipad.altfix.js"></script>
<style>
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
margin-top: 10px;
}
ul {
margin: 0;
}
#contentWrap {
width: 800px;
margin: 0 auto;
height: 500px;
overflow: hidden;
background-color: #FFFFFF;
border: solid 2px #EEEEEE;
}
#contentTop {
width: 600px;
padding: 10px;
margin-left: 30px;
}
#sortable …推荐指数
解决办法
查看次数
为什么在Chrome中使用CSS3列会删除列表中的项目编号
当我添加css来操纵列数时,我注意到chrome正在删除列表项上的数字...
例如:
<ol style =-webkit-column-count: 2;...">
....
</ol>
上面的确设法按照预期将li溢出到一个单独的列中,但它也删除了默认的项目编号.这在Firefox中不会发生,只有chrome.
有任何想法吗？
推荐指数
解决办法
查看次数
javascript删除li而不删除ul？
有没有办法删除ul的li元素而不删除ul？我似乎只能找到这个.
var element = document.getElementById('myList');
element.parentNode.removeChild(element);
但是,这删除了ul.我希望能够动态删除和附加li元素,而不必每次删除li元素时都必须创建元素.只是寻找一种更简单的方法.谢谢你的帮助.
<div id="listView">
<ul id="myList" class="myList-class">
<li>item 1</li>
<li>item 2</li>
</ul>
</div>
推荐指数
解决办法
查看次数
标签 统计
html-lists ×10
css ×6
html ×6
javascript ×3
html5 ×2
jquery ×2
draggable ×1
focus ×1
inline ×1
positioning ×1
removechild ×1
sorting ×1