Существует ли синтаксис для устранения неоднозначности имен классов CSS между двумя таблицами стилей? - PullRequest
Новая
       1

Существует ли синтаксис для устранения неоднозначности имен классов CSS между двумя таблицами стилей?

4 голосов
/ 16 февраля 2011

Допустим, у меня есть HTML-страница, которая импортирует две таблицы стилей, например, так: 

<link href="Styles1.css" rel="stylesheet" type="text/css" />
<link href="Styles2.css" rel="stylesheet" type="text/css" />

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

.SomeStyle {font-weight:bold;  } /* in Styles1.css */
.SomeStyle {font-weight:normal;} /* in Styles2.css */

Вопрос : существует ли синтаксис, в котором я могу применить класс к элементу таким образом, чтобы устранить неоднозначность, какую версию стиля использовать?

Например (псевдокод): 

<span id="mySpan" class="Styles1.css:SomeStyle">Example</span>

Отказ от ответственности: Я знаю, что лучшим решением будет разрешение конфликта имен между двумя таблицами стилей, ноЯ спрашиваю в основном по академическим причинам.

Ответы [ 4 ]

7 голосов
/ 16 февраля 2011

Существует ли синтаксис, в котором я могу применять класс к элементу таким образом, чтобы не указывать, какую версию стиля использовать?

Нет. Последний стиль переопределяет первый в один вычисленный стиль. Отменить это невозможно.

Единственное, что вы можете сделать, это добавить дополнительные классы к каждому определению: 

.SomeStyle.First {font-weight:bold;  } /* in Styles1.css */
.SomeStyle.Second {font-weight:normal;} /* in Styles2.css */

и затем используйте 

<span id="mySpan" class="SomeStyle Second">Example</span>
1 голос
/ 06 января 2015

Некоторые люди предпочитают добавлять классы в тег body еще одной страницы, чтобы они могли устранить неоднозначность, например. 

<body class="newer">

, а затем использовать это при указании новых функций 

.SomeStyle {font-weight:bold;} /* in Styles1.css */
.newer .SomeStyle {font-weight:normal;} /* in Styles2.css */

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

.SomeStyle {font-weight:bold;} /* in Styles1.css */
.SomeStyle {font-weight:normal;} /* in Styles2.css */
.SomeStyle {font-weight:bold;} /* in PageSpecific.css */
0 голосов
/ 16 февраля 2011

Просто мысль, не очень подробная, но. Может быть, вы можете использовать php include и кнопку отправки для вызова функции через JavaScript, чтобы включить требуемый css. (на самом деле вам не понадобится JS)

0 голосов
/ 16 февраля 2011

Возможно, есть способ использовать jQuery или что-то похожее на переименование (удаление и добавление в качестве другого имени) одного из классов, чтобы у него было уникальное имя. Может быть, вы могли бы читать обе таблицы стилей, а не ссылаться на них, и пройти через jQuery, добавить классы на страницу по мере их чтения, а затем изменить любые имена классов, которые уже существуют?

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

Просто быстрая мысль ...

...