Javascript 创建自定义列表项HTML，行间距为
我目前正在做一个项目，我想展示一个类似于苹果股票应用程序的东西，一行的名字后面跟一个当前的数字，然后是一个+-指示器，指示股票比之前上涨或下跌了多少。我真的很喜欢这个黑色背景下的行设计，并且认为它很容易阅读，所以这就是我想做的原因。目前，我正在尝试创建一行HTML与CSS的组合，这将给我这种外观和感觉，一个自定义列表项，如果你愿意的话 我已经设置了正/负指示符，但无法确定如何在同一列表项行中分隔并包含此元素左侧的文本。理想情况下，布局应如下所示： STOCKNAME PREVTOTAL STOCKPOSORNEG 所有这些字段都应位于同一列表项行中。由于我在使用未排序列表时遇到了一些问题，所以我也可以探索一个表选项，但想看看是否有一种方法可以先这样做。下面是我通过TryIt编辑器进行的实验：Javascript 创建自定义列表项HTML，行间距为,javascript,html,css,Javascript,Html,Css,我目前正在做一个项目，我想展示一个类似于苹果股票应用程序的东西，一行的名字后面跟一个当前的数字，然后是一个+-指示器，指示股票比之前上涨或下跌了多少。我真的很喜欢这个黑色背景下的行设计，并且认为它很容易阅读，所以这就是我想做的原因。目前，我正在尝试创建一行HTML与CSS的组合，这将给我这种外观和感觉，一个自定义列表项，如果你愿意的话 我已经设置了正/负指示符，但无法确定如何在同一列表项行中分隔并包含此元素左侧的文本。理想情况下，布局应如下所示： STOCKNAME PREVTOTAL STOC
<!DOCTYPE html>
<html>
<head>
<style>
#rcorners1 {
border-radius: 7px;
background: #80ff80;
padding: 20px;
width: 90px;
height: 10px;
color: #FFF;
}
#makeLeft {
float: left;
}
#makeRight {
float: right;
}
#listitem {
list-style: none;
background-color: black;
border: .5px solid #efeff5;
padding: 1px;
}
</style>
</head>
<body>
<ul id="mylist">
<li id="listitem">
<p id="rcorners1">
<span id="makeLeft"><strong>+</strong></span>
<span id="makeRight"><strong>1234.00</strong></span>
</p>
</li>
</ul>
</body>
</html>
#rcorners1{
边界半径：7px；
背景#80ff80；
填充：20px；
宽度：90px；
高度：10px；
颜色：#FFF；
}
#makeLeft{
浮动：左；
}
#权宜之计{
浮动：对；
}
#列表项{
列表样式：无；
背景色：黑色；
边框：.5px实心#EFFf5；
填充：1px；
}
-
+
1234.00
字体span{
字体系列：arial；
字体大小：24px；
颜色：#fff；
}
.集装箱{
宽度：400px；
高度：200px；
背景：#040404；
}
.行{
位置：相对位置；
宽度：计算（100%-20px）；
高度：29px；
填充：13px 10px 13px；
}
.row.突出显示{
背景#3838；
}
.姓名{
浮动：左；
}
.价格{
显示：内联块；
右边距：3倍；
}
.pn{
右侧填充：5px；
}
.pn con{
位置：绝对位置；
顶部：10px；
右：10px；
}
.主要零件编号{
显示：内联块；
高度：29px；
填充：3倍；
左侧填充：10px；
右边填充：10px；
边界半径：5px；
背景#FD3C2F；
}
道指
18,109.80
-
53.19
MSFT
47.58
-
0.04