Форум программистов
 
Расширенный поиск
Контакты: о проблемах с регистрацией, почтой и по другим вопросам пишите сюда - alarforum@yandex.ru, проверяйте папку спам! Обязательно пройдите активизацию e-mail.

Вернуться   Форум программистов > Web > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Excel VBA, CAD, Софт, ОС, Windows, Ubuntu, Android, VPS
Win Api, Assembler, C++, Java, Pascal, Lazarus, Delphi, OpenGL, DirectX
C#, Qt, .NET, ASP.NET, Windows Forms, ADO.NET, Framework, WPF, UWP, WinRT, XAML
HTML, CSS, JavaScript, Ajax, PHP, Perl, Python, Ruby, SQL, WordPress, API, XML, JSON, ActionScript, Flash

Ответ
 
Опции темы
Старый 22.12.2016, 19:28   #1
index58
Пользователь
 
Регистрация: 28.07.2016
Сообщений: 23
Репутация: 10
По умолчанию Наследование в CSS, как в других языках программирования

Здравствуйте!
Я только начинаю изучать HTML и CSS, хотя, с программированием уже знаком на практике.
У меня вопрос общего плана по наследованию в CSS.
Допустим, у меня есть общий класс "column", в котором задаются значения для всех видов колонок.
Код:

.column {
	width: 100%;
	border: 1px;
	border-style: solid;
	border-color: #000000;
	border-collapse: collapse;
}

А затем от этого класса я хочу унаследовать, допустим, левую колонку "left_column". Но так, чтобы не нужно было переписывать все свойства, а только те, у которых значения новые. Допустим, у левой колонки всё то же самое, только ширина фиксированная.
Код:

.left_column {
	width: 250px;
}

А остальные свойства я КАК-ТО УНАСЛЕДУЮ от класса "column".
Вопрос: Возможно ли это, и как?
По сути, вопрос в том, есть ли в CSS обычное наследование классов, как в других языках программирования, и если есть, то как оно делается.
index58 вне форума   Ответить с цитированием
Старый 22.12.2016, 19:34   #2
Alex11223
Модератор
Заслуженный модератор
 
Регистрация: 12.01.2011
Сообщений: 13,152
Репутация: 2564

icq: 512-7шесть5
skype: alexp.frl
По умолчанию

наверно можно так
Код:

 class="column left-column"

они ж применятся в этом порядке. Но я не настоящий верстальщик.

В Sass есть. http://sass-lang.com/guide
Alex11223 на форуме   Ответить с цитированием
Старый 22.12.2016, 21:16   #3
index58
Пользователь
 
Регистрация: 28.07.2016
Сообщений: 23
Репутация: 10
По умолчанию

Так не хотелось бы, ибо если поменяю структуру классов в файле CSS, то придётся переписывать и HTML-код. Нужно, чтобы в HTML-коде можно было указать только один класс "left_column", но при этом применялись бы свойства всех предков. Ниужели такого способа нет в CSS? Это будет очень печально.
index58 вне форума   Ответить с цитированием
Старый 22.12.2016, 21:18   #4
Alex11223
Модератор
Заслуженный модератор
 
Регистрация: 12.01.2011
Сообщений: 13,152
Репутация: 2564

icq: 512-7шесть5
skype: alexp.frl
По умолчанию

Без Sass и т.п. вроде нет.

Но есть Sass
Alex11223 на форуме   Ответить с цитированием
Старый 22.12.2016, 21:26   #5
index58
Пользователь
 
Регистрация: 28.07.2016
Сообщений: 23
Репутация: 10
По умолчанию

Ясно. Скажите, а по-русски про Sass где лучше почитать?
Нашёл: http://sass-scss.ru/

Последний раз редактировалось index58; 22.12.2016 в 21:31.
index58 вне форума   Ответить с цитированием
Старый 22.12.2016, 21:31   #6
Alex11223
Модератор
Заслуженный модератор
 
Регистрация: 12.01.2011
Сообщений: 13,152
Репутация: 2564

icq: 512-7шесть5
skype: alexp.frl
По умолчанию

Не знаю, не читал по-русски.
Alex11223 на форуме   Ответить с цитированием
Старый 22.12.2016, 22:47   #7
Вадим Мошев
гигаМодератор :)
Заслуженный модератор
 
Аватар для Вадим Мошев
 
Регистрация: 12.11.2010
Адрес: Адрес: Адрес: Адрес: Адрес: Адрес: Адрес: Адрес: Адрес:
Сообщений: 7,120
Репутация: 3559
По умолчанию

Всё проще намного. То, о чём спрашивает автор темы, можно сделать так.
Через запятую перечисляем имена классов - они получают те свойства, которые мы задали. Ниже у нужных классов просто меняем нужные свойства. В коде это будет выглядеть так:
Код:

.column,
.left_column {
	width: 100%;
	border: 1px;
	border-style: solid;
	border-color: #000000;
	border-collapse: collapse;
}

.left_column {
	border: 3px;
	border-color: red;
	border-style: dashed;
}

Вадим Мошев вне форума   Ответить с цитированием
Старый 23.12.2016, 00:16   #8
index58
Пользователь
 
Регистрация: 28.07.2016
Сообщений: 23
Репутация: 10
По умолчанию

Вооот!
Это мне и нужно было. Запись через запятую вполне можно интерпретировать, как наследование
Спасибо!
index58 вне форума   Ответить с цитированием
Старый 23.12.2016, 00:42   #9
Alar
Александр
Администратор
 
Аватар для Alar
 
Регистрация: 28.10.2006
Адрес: Химки
Сообщений: 11,510
Репутация: 2489
По умолчанию

index58, это не наследствование. просто нижняя запись перезаписывает все что раньше было.

Код:

.column,
.left_column {
	width: 100%;
	border: 1px;
	border-style: solid;
	border-color: #000000;
	border-collapse: collapse;
}

.left_column {
	border: 3px;
	border-color: red;
	border-style: dashed;
}

.column {
	border: 2px;
}

и от этого .left_column - 2 не станет, что подразумевает наследствование

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

Код:

.column {
	width: 100%;
	border: 1px;
	border-style: solid;
	border-color: #000000;
	border-collapse: collapse;
}

.left_column {
	width: 100%;
	border: 1px;
	border-style: solid;
	border-color: #000000;
	border-collapse: collapse;
}

Ну и где здесь наследствование?
Alar вне форума   Ответить с цитированием
Старый 23.12.2016, 01:05   #10
index58
Пользователь
 
Регистрация: 28.07.2016
Сообщений: 23
Репутация: 10
По умолчанию

Alar, я про наследствование вообще ни слова не говорил... Это если шутить
А если серьёзно, то я знаю, что это не наследование, а просто сокращение кода. Я, кстати, и не говорил, что это наследование. Я сказал, что это можно интерпретировать, как наследование
index58 вне форума   Ответить с цитированием
Ответ



Опции темы

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.

Быстрый переход

Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Выполнение в c# скриптов, написанных на других языках MilaMesh Общие вопросы .NET 10 22.11.2013 16:26
Оператор ветвления в различных языках программирования Linel Свободное общение 15 15.09.2011 08:31
Библиотеки на разных языках программирования Яр|/||< (^_^) Свободное общение 2 25.03.2010 10:50




10:52.


Powered by vBulletin® Version 3.8.8 Beta 2
Copyright ©2000 - 2017, Jelsoft Enterprises Ltd.

купить трафик


как улучшить посещаемость, а также решения по монетизации сайтов, видео и приложений

RusProfile.ru


Справочник российских юридических лиц и организаций.
Проекты отопления, пеллетные котлы, бойлеры, радиаторы
интернет магазин respective.ru