bjay tiamsic Ответов: 2

Разница между встроенным CSS и внешним CSS

Привет. Я работаю над проектом в ASP.Net и я используем как встроенный CSS, так и внешний CSS на LinkButto.

Может ли кто-нибудь объяснить мне, почему этот встроенный CSS работает (показывает кнопку):
<asp:LinkButton ID="lnkViewPayslip" runat="server" Width="16px" Height="16px" style="background:url(../Images/GridViewButtons/payslipview.png) no-repeat center;width:16px;height:16px"></asp:LinkButton>


но этот не работает (не показывает изображения):


в голове бирка:
<link href="../Styles/HeaderFooterMainTemplateEmp.css" rel="stylesheet" type="text/css" />


в HeaderFooterMainTemplateEmp.css, который находится в папке Style:
.payslip {background:url(../Images/GridViewButtons/payslipview.png) no-repeat center;width:16px;height:16px }


на страницах:
<asp:LinkButton ID="lnkViewPayslip" runat="server" CssClass="payslip" Width="16px" Height="16px"></asp:LinkButton>



Я действительно сейчас в замешательстве. Я уверен, что имею в виду правильный внешний CSS, потому что работает другой CssClass. :(

Большое спасибо!

2 Ответов

Рейтинг:
8

MukeshKumar89

Привет,

Позвольте мне привести небольшой пример каждого из них, чтобы лучше понять его.

Встроенный CSS

Встроенный стиль теряет многие преимущества таблиц стилей, смешивая контент с презентацией. Используйте этот метод экономно! Для использования встроенных стилей используется атрибут style в соответствующем теге. Атрибут style может содержать любое свойство CSS. В этом примере показано, как изменить цвет и левое поле абзаца:

<p style="color: sienna; margin-removed 20px”>This is a paragraph.</p></pre><br mode=" hold=" /><br mode=" html="><br mode="></p>


внешняя таблица CSS

Внешняя таблица стилей идеально подходит, когда стиль применяется ко многим страницам. С помощью внешней таблицы стилей можно изменить внешний вид всего веб-сайта, изменив один файл. Каждая страница должна ссылаться на таблицу стилей с помощью тега <link>. Тег <link> находится внутри раздела head:

<head>

css” href=”mystyle.css” />

</head>

Внешняя таблица стилей может быть написана в любом текстовом редакторе. Файл не должен содержать никаких html-тегов. Ваша таблица стилей должна быть сохранена с расширением .css. Ниже приведен пример файла таблицы стилей:
hr {color:sienna;}

p {margin-left:20px;}

body {background-image:url(“images/back40.gif”);}


надеюсь, это вам поможет.
спасибо

Рейтинг:
2

lw@zi

Здесь вы используете относительный путь. Расположение изображения, когда вы используете встроенный CSS, может быть правильным (что-то вроде: [root]/Images/GridViewButtons/payslipview.png).

Однако при перемещении этого файла в CSS-файл разрешенный путь может быть неверным. Предполагая, что ваша структура решения такова [root]->AllCSS->SubFolder->CSSFile В этом случае разрешенный путь будет просто неверным. Ваше приложение будет пытаться найти изображение в папке AllCSS.

Вам просто нужно убедиться, что относительный путь, указанный в файле CSS, точен относительно файла CSS.

bjay tiamsic

но этот работает в HeaderFooterMainTemplateEmp.css

.док-пункт { справочная информация:URL-адрес(../изображений/GridViewButtons/док.формат PNG) нет-повторяю 0px; ширина:16px и; высота:16px и; дисплей:инлайн-блок; }

lw@zi

Является ли "относительный" путь, упомянутый в файле CSS, правильным?

bjay tiamsic

- Да, сэр. Я на 100% уверен, что это правильно, потому что другие классы работают при вызове в свойстве CssClass элемента управления