在我的CSS中添加文本并将其显示在html页面电子邮件中

时间:2014-04-24 07:25:45

标签: css jenkins jenkins-plugins

我想知道是否有办法在css中添加“text”,以便html页面可以写出来。 这是因为html页面无法处理我的inparameters($ {var})。 我正在使用jenkins可编辑的电子邮件插件

所以我有我的CSS:

<style type="text/css">
a{color:#4a72af}
body{background-color:#e4e4e4}
body,p{margin:0;padding:0}
img{display:block}
h1,h2,h3,h4,h5,h6{margin:0 0 .8em 0}
h3{font-size:28px;color:#444!important;font-family:Arial,Helvetica,sans-serif}
h4{font-size:22px;color:#4a72af!important;font-family:Arial,Helvetica,sans-serif}
h5{font-size:18px;color:#444!important;font-family:Arial,Helvetica,sans-serif}
p{font-size:12px;color:#444!important;font-family:"Lucida Grande","Lucida Sans","Lucida Sans    Unicode",sans-serif;line-height:1.5}
ol li img{display:inline;height:20px}
/*div styles*/
.news{text-align:center;padding-top:15px;}
.content{width:720px;margin:0 auto;background-color:white}
.round_border{margin-bottom:5px;-webkit-border-radius:6px;-moz-border-radius:6px;border- radius:6px;margin-top:0;font-size:14px;padding:6px;border:1px solid #ccc}
.status{background-color:<%= 
        ${MyVar} == "Open" ? 'green' : 'red' %>;font-size:28px;font-weight:bold;color:white;width:720px;height:52px;margin-bottom:18px;text-align:center;vertical-align:middle;border-collapse:collapse;background-repeat:no-repeat}
.status .info{color:white!important;text-shadow:0 -1px 0 rgba(0,0,0,0.3);font-size:32px;line-height:36px;padding:8px 0}
.main img{width:38px;margin-right:16px;height:38px}
.main table{font-size:14px;}
.main table th{text-align:right;}
.bottom-message{width:720px;cellpadding:5px;cellspacing:0px}
.bottom-message .message{font-size:13px;color:#aaa;line-height:18px;text-align:center}
.bottom-message .designed{font-size:13px;color:#aaa;line-height:18px;font-style: italic;text-align:right}
</style>
<body>
<div class="content round_border">
<div class="status">
<p class="info">TEST</p>
</div>
<!-- status -->
<div class="main round_border">
<table>
<tbody>
<tr>
 <th>Name:</th>
 <td>HERE IS WHERE THE TEXT SHOULD BE</td>
 </tr>
 ....

正如你在我的文字中看到的那样,我在css中得到了一个$ {MyVar}。这很好用。但现在我想要另一个$ {MyVar2},它有一个字符串,我想去这里:

<td>HERE IS WHERE THE TEXT SHOULD BE</td>

因为我不能写

<td>${MyVar2}</td>

会产生错误

所以我想用它来像

.test ${MyVar2}

然后将其添加到

<td class="test"></td>

有办法吗?

1 个答案:

答案 0 :(得分:0)

好吧,你可以使用:: before或:: after伪元素并设置它们的内容:

div::after
{
    content: 'Hello!';
}

JSFiddle