css - 如何使用 css 将图像添加到 xml 工作表

Question

我如何在表格行的开头添加一个位于我本地机器上的那个位置的小三 Angular 形图像？

这是我的 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;

Answer 1

使用 XSLT 执行此操作要容易得多，在 XSLT 中您可以对文件中的每个子项运行 foreach 并应用电子表格中的样式，但您可以使用 XML 和 CSS 执行此操作。您需要在 xml 文件中设置 header ，然后调用样式表，如下所示:

<?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 设置样式一样