Как опустить таблицу стилей, чтобы применить стиль к другой веб-странице

Question

Я делаю один ретранслятор сообщения, как диалог уведомления о новом сообщении из этой ссылки http://codepen.io/petebot/full/CpKzI здесь я только что нашел одну новую таблицу стилей, которая хорошо смотрится в диалоге сообщений. но с небольшим ограничением я хочу только этот стиль управления с этим именем таблицы стилей:

<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>

как бы эта таблица стилей ни влияла на всю главную страницу. поэтому хочу опустить эту таблицу стилей на другую страницу. только этот пользовательский элемент управления имеет это. так что для этого я создаю пользовательский веб-контроль. но все же это влияет на все веб-страницы.

здесь я включаю один снимок экрана:

Помогите мне, пожалуйста...

Answer 1

Мне очень трудно понять, что вы хотите, но похоже, что вы пытаетесь настроить таблицу стилей только на один элемент в DOM, а не так, как работают таблицы стилей. Таким образом, вы можете либо присвоить этому элементу DOM идентификатор, а затем нацелить все правила таблицы стилей специально на этот идентификатор, например так:

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

#thisBox { styles go here }

Однако в данном конкретном случае похоже, что вы пытаетесь использовать платформу Foundation для одной части вашего проекта. Foundation - это целая структура, которая предназначена для создания веб-сайтов, я думаю, вам лучше использовать собственные стили.