在c#服务器端覆盖css.after和.before

时间:2021-03-11 19:38:35

i have a code like this :

我有这样的代码:

string UserPic="images/1.png";
    DataTable Chat_dt = new SQLHelper(SQLHelper.ConnectionStrings.WebSiteConnectionString).getQueryResult(query);
    if (Chat_dt.Rows.Count > 0)
    {
        foreach (DataRow row in Chat_dt.Rows)
        {
            if (row["MESSAGE_SENDER_ID"].ToString() == UserID)
            {
                ToAppend += "<div class='bubbledLeft' >"
                         + row["MESSAGE_BODY"].ToString()
                         + "</div>";
            }
            else
            {
                ToAppend += "<div class='bubbledRight' >"
                         + row["MESSAGE_BODY"].ToString()
                         + "</div>";
            }
        }

    }

css

.bubbledLeft:after{
z-index: -1;
position: absolute;
left: -36px;
width: 32px;
bottom: 0px;
height: 32px;
content:"";

/*background-image: url(left_chatter.png);*/
background-size: 32px 32px;
background-position: bottom left;

border-radius: 3px;
-webkit-border-radius: 3px; 
-moz-border-radius: 3px;    
-o-border-radius: 3px;  
-ms-border-radius: 3px; 
}

my question is how can i modify the .bubbledLeft:after background-image and set it as UserPic from the server side function? is that possible ?

我的问题是如何修改.bubbledLeft:after background-image并将其设置为UserPic来自服务器端功能?那可能吗 ?

**PS:**the server side function is an ajax request where on success i append the resulting html in a div

** PS:**服务器端功能是ajax请求,在成功时我将结果html附加到div中

1 个解决方案

#1


0  

We can do something as suggested in my comment, however looks like you can just append a <style></style> to the response with some style for the .bubbledLeft:after to override the current style (even with !important flag if needed):

我们可以按照我的评论中的建议做一些事情,但看起来你可以在响应中添加

//if the style does not override, you can try using the !important flag
ToAppend += "<style>.bubbledLeft:after { background-image: url(...); }</style>";

#1


0  

We can do something as suggested in my comment, however looks like you can just append a <style></style> to the response with some style for the .bubbledLeft:after to override the current style (even with !important flag if needed):

我们可以按照我的评论中的建议做一些事情,但看起来你可以在响应中添加

//if the style does not override, you can try using the !important flag
ToAppend += "<style>.bubbledLeft:after { background-image: url(...); }</style>";