Від автора: у цій главі ми розглянемо Sass коментарі. Вони являють собою розміщені у вихідному коді неисполняемые оператори і роблять вихідний код більш зрозумілим. SASS підтримує два типи коментарів.
Багаторядкові коментарі. Вони прописуються за допомогою спеціальних символів /* та */. Багаторядкові коментарі зберігаються в вихідному коді CSS.
Однорядкові коментарі. Вони прописуються за допомогою спеціального символу //, за яким слідує коментар. Однорядкові коментарі не зберігаються в вихідному коді CSS.
Приклад
Наступний приклад демонструє використання коментарів у файлі SCSS:
SASS comments
Welcome to TutorialsPoint
TutorialsPoint
Потім створіть файл style.scss.
/* Цей коментар складається
* більш ніж з одного рядка,
* так як для нього використовується синтаксис коментарів CSS,
* він зберігається у вихідному коді CSS. */
body { color: black; }
// Ці коментарі складаються з одного рядка.
// Вони не зберігаються в вихідному коді CSS,
// так як для них використовується синтаксис однорядкових коментарів.
a { color: blue; }
Ви можете вказати SASS переглядати файл і оновлювати CSS кожен раз, коли змінюється файл SASS, з допомогою наступної команди:
sass –watch C:\ruby\lib\sass\style.scss:style.css
Потім виконайте наведену вище команду; вона автоматично створить файл style.css з наступним кодом:
/* Цей коментар складається
* більш ніж з одного рядка,
* так для нього використовується синтаксис коментарів CSS,
* він зберігається у вихідному коді CSS. */
body {
color: black; }
a {
color: blue; }
Результат на виході
Давайте виконаємо наступні дії, щоб подивитися, як працює наведений вище код:
Збережіть зазначений вище html-код у файлі sass_comments.html.
Відкрийте HTML-файл у браузері, ви повинні побачити те ж, що наведено на малюнку.
Щоб отримати інформацію по інтерполяції всередині багаторядкових коментарів, перейдіть за цим посиланням.
Sass — Інтерполяція в коментарях багаторядкових
Опис. Інтерполяція всередині багаторядкових коментарів регулюється в отриманому CSS. Ви можете вказати змінні або імена властивостей у фігурних дужках.
Синтаксис
$var : “value”;
/* багаторядковий коментар #{$var} */
На наступному прикладі ми продемонструємо використання інтерполяції в багаторядкових коментарях у файлі SCSS:
SASS comments
Welcome to TutorialsPoint
This is an example for Interpolation in SASS.
Потім створіть файл style.scss.
/* Версія фреймворку для згенерована коду CSS – 7.8. */
Результат на виході
Давайте виконаємо наступні дії, щоб побачити, як працює наведений вище код:
Збережіть зазначений вище html-код у файлі sass_comments_interpolation.htm.
Відкрийте HTML-файл у браузері, ви повинні побачити те ж, що наведено на малюнку.