0

我正在制作一个消息转发器,例如来自此参考的新消息通知对话http://codepen.io/petebot/full/CpKzIhere 我刚刚找到了一个新样式表,它使消息对话看起来很漂亮。但几乎没有限制我只想用这个样式表名称来控制这个样式:

<link id="Link2" href="../css/foundation.min.css" rel="stylesheet" type="text/css" target="_self"/>

所以。我正在使用这样的网络用户控制来控制这个用户:

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="notification.ascx.cs" Inherits="Staff_notification" %>
<link id="Link1" href="../css/notification.css" rel="stylesheet" type="text/css"/>
<link id="Link2" href="../css/foundation.min.css" rel="stylesheet" type="text/css" target="_self"/>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<div class="contain"><a href="#" class="notificationicon on" style="position:relative;text-decoration:none;">Messages&nbsp;<span class="noti_bubble1" runat="server" id="message_alert"><asp:Label ID="lbl_count_messages" runat="server"></asp:Label></span></a>
    <ul id="notificationMenu" class="notifications">
      <li class="titlebar">
        <span class="title">Messages</span>
        <span class="settings"><i class="icon-cog"></i>
        </span>
      </li>
      <div class="notifbox">
      <ul>
       <asp:Repeater ID="Repeater_Messages" runat="server">
       <ItemTemplate>
        <li class=" notif">
          <a href="Ticket.aspx?ticketid='<%#Eval("Ref_no")%>'&flag=0">
            <div class="imageblock">
             <asp:Image ID="userphoto" runat="server" CssClass="notifimage" ImageUrl = "../DisplayImage.ashx?userId='<%#Eval('UserId')%>"/>
            </div> 
            <div class="messageblock">
              <div class="message"><strong><%#Eval("Name")%></strong>:<br/><%#Eval("Message")%></div>
              <div class="messageinfo">
                <i class="icon-comment"></i><%# DataBinder.Eval(Container.DataItem,"CreatedDate","{0:ddd, dd MMMM yyyy}")%>&nbsp;at&nbsp;<%# DataBinder.Eval(Container.DataItem,"CreatedDate","{0:hh:mm tt}")%></div>
            </div>
          </a>
        </li>
       </ItemTemplate>
        </asp:Repeater>
        </ul>
      </div>
      <li class="seeall">
        <a href="javascript:void(0);" id="hpl_close">Close</a>
      </li>
    </ul>
  </div>

此样式表如何影响所有母版页。所以想省略这个样式表到其他页面。只有这个用户控件有这个。所以为此我创建了网络用户控件。但它仍然影响所有网页。

在这里我包括一个屏幕截图:

在此处输入图像描述

请帮我...

4

1 回答 1

1

我很难理解你想要什么,但听起来你试图让一个样式表只针对 DOM 中的一个元素,这不是样式表的工作方式。因此,您的选择是给该 DOM 元素一个 ID,然后将样式表的所有规则专门针对该 ID,如下所示:

<div id="thisBox" class="notifbox">

#thisBox { styles go here }

但是,在这种特殊情况下,您似乎正在尝试将 Foundation 框架用于您的一个设计。Foundation 是一个完整的框架,旨在构建网站,我认为您最好滚动自己的样式。

于 2014-05-26T06:14:11.740 回答