如何使用css将图像添加到xml表格

如何将位于本地机器上的小三角形图像添加到该表格行的开头位置？如何使用css将图像添加到xml表格

继承人我CSS

stock:nth-child(1){ 
    display:table-row; 
    content: url('..\stock\down.gif'); 
    color:red; 
}

和相应的XML

<stock class="down"> 
    <symbol>AAPL</symbol> 
    <company>Apple Computer, Inc.</company> 
    <lastSale>$15.26</lastSale> 
    <netChange>-0.17</netChange> 
    <pChange>-1.10%</pChange> 
    <volume>5.548</volume> 
    </stock>

这里是一个多更好的方法来写CSS

stock[class~=down]{ 
    border-bottom: 2px solid black; 
    display:block; 
    background: url("down.gif") no-repeat; 
    color:red;

}

来源

2015-08-25 Dallan Baker

你不妨查看xslt，这是xml特有的样式语言。它允许css – nomistic

那么你是说没有办法？我将在不久的将来学习xslt，但是这个项目应该只用css来完成。 –

这是可能的，但使用XSLT更容易。请参阅示例如何使用直接的XML和CSS来设计样式 – nomistic

这是一个很容易做到这与XSLT，您可以在文件中的每个孩子运行一个foreach，并从电子表格应用样式，但你可以用XML和CSS来做到这一点。你需要设置的标头在XML文件中，然后调用样式表，就像这样：

<?xml version="1.0" encoding="UTF-8"?> 
<?xml-stylesheet type="text/css" href="stylesheet.css"?> 

    <stock class="down"> 
    <symbol>AAPL</symbol> 
    <company>Apple Computer, Inc.</company> 
    <lastSale>$15.26</lastSale> 
    <netChange>-0.17</netChange> 
    <pChange>-1.10%</pChange> 
    <volume>5.548</volume> 
    </stock>

然后你只需要修改你的CSS文件，让你喜欢的任何变化。

例如：

（编辑图像）：

stock { 
    display:block; 
    margin-left:20px; 
} 

symbol { 
    display: list-item; 
    list-style: url("..\stock\down.gif"); 

} 
company { 
    display: list-item; 
    list-style: url("..\stock\down.gif"); 
}

然后你可以改变这一点，你怎么样，以同样的方式你会样式HTML

来源

2015-08-26 20:35:06 nomistic

是的，我确实在我的xml中引用了css。这些只是我遇到的问题的剪辑。我有使用CSS表格的XML样式。我想知道如何使用CSS添加图像。我用的代码是“content：url（'.. \ stock \ down.gif'）;”没有工作来添加图像。 –

@DallanBaker好吧我编辑它包含一个图像（我测试了类似的东西，所以它应该工作） – nomistic

好吧我尝试过使用它，它没有工作。有没有办法在我的股票中做到这一点：第一个孩子（1）元素？那条线是如何正确指向我的本地机器上的图像的？ –

如何使用css将图像添加到xml表格

回答

相关问题