• Страница 1 из 1
  • 1
Форум » Web-Раздел » Начинающему вебмастеру » Разметка в CSS сайта uCoz
Разметка в CSS сайта uCoz
Kosten
Суббота, 31 Октября 2015 | Сообщение 1
Оффлайн
Администраторы
Сообщений:44267
Награды: 70
Бывает такое что заходя на свой сайт в админ панель а потом в стили CSS там вы видим разметку. А что оно означает и за что под ней стили отвечают, думаю можно понять только на модуль форум. Но нам нужно знать остальные, и не знаю как сейчас после обновление всяких, не должно было измениться. Но вообщем на всякий случай лучше знать, так как их немного и думаю быстро поймете.



[info]/* General Style */
В ней расположены все коды, что отвечают за сам каркас шаблона, он
отвечает за отображение таблиц, тип и цвет шрифта и ссылок и прочих
мелочей.
/* Menus */
Здесь можно отредактировать какой рисунок будет перед ссылок в главном меню своего сайта, а также его отступы и многое другое.
/* Main Menu */
Практически тоже самое, что и предыдущий, но добавляются цвет ссылок
и тип текста. Если вы немного понимаете css, на уровне новичка, то
сразу должны увидеть.
/* Module Part Menu */
Отвечает за блок новости сайта, как вы уже видели на многих сайтах.
Можно заменить цвет ссылок, и рисунок возле названия категории.
/* Entries Style */
Регулирует блок вид материалов в новостях, и всех остальных
модулях. Можно заменить размер, тип, цвет шрифта, добавить фон блока, и
все что тебе захочется.
/* Entry Manage Table */
Здесь я никогда ничего не меняю, не видел за что он отвечает. Можете его не редактировать.
/* Comments Style */
По названию можно понять, что отвечает за отображение вид комментариев, и мини-чата. можно изменить фон, цвет текста.
/* Comments Form Style */
Отвечает за саму таблицу комментариев. Также можно добавить фон и сменить границы самой таблицы, их цвет и размер.
/* News/Blog Archive Menu */
Буквально вчера разобрался за что отвечает эта часть таблицы. после
обновления системы, можно добавить блок "Архив материалов", после чего
будет доступен блок, с месяцами обновлений на сайте. Пример на главной
моего блога.
/* News/Blog Archive Style */
Этот не знаю, не видел его в рабочем состоянии, и нигде в коде у меня он не использовался.
/* News/Blog Calendar Style */
Отвечает за календарь новостей, блога... можно сменить полностью вид календаря до мельчайших подробностей.
/* Poll styles */
Регулирует отображение, функции "опрос" на сайте.
/* User Group Marks */
Здесь можно изменить цвет группы пользователей. Поставить дополнительные иконки.
/* Other Styles */
Без комментариев...
Осталась часть, которая отвечает за отображение форума. Начинается она с такого текста:
/* ===== forum Start ===== */ [/info]

PS - просто когда вы что то прописываете в стилях CSS, лучше по верх ставить такую разметку. К примеру поставили мини профиль и прописали стили, по верх ставим /* Prifyl Style */ и вы уже будете знать, за что отвечает.
Прикрепления: 8804382.jpg (6.5 Kb)
Страна: (RU)
AnTron
Суббота, 31 Октября 2015 | Сообщение 2
Оффлайн
Пользователи
Сообщений:37
Награды: 0
Почему так думаете нет их, есть и идут системой.

Добавлено (31.10.2015, 20:18)
---------------------------------------------
А что говорите, нужно подписывать каждый стиль, это правильно, английскими буквами.

Страна: (RU)
Kosten
Суббота, 31 Октября 2015 | Сообщение 3
Оффлайн
Администраторы
Сообщений:44267
Награды: 70
Но хорошо, что не поменялось.
Страна: (RU)
Kosten
Вторник, 03 Ноября 2015 | Сообщение 4
Оффлайн
Администраторы
Сообщений:44267
Награды: 70
[info]Теперь о том как найти и отредактировать класс в CSS (например цвет нужно поменять)
Метод 1-й - от frozen
1) Открываете Вид-Просмотр ХТМЛ кода нужной страницы.
2) Находите в тексте объект, параметры которого требуется изменить, и смотрите какой у него класс.
3) Затем ищите этот класс в таблице стилей css.
4) И меняете как нужно параметры.
Если отдельного класса нет, то добавляете его в шаблон (через Панель управления), а в таблице стилей css добавляете с нужными параметрами.
Метод 2-й - от booroondook
1) Открываете в браузере нужную страницу сайта.
2) Сохраняете в браузере эту страницу в виде HTML-файла. Например, в IE выполняем команду "Файл - Сохранить как..." и указываем в опциях вариант "Web-страница полностью" - это вызовет также сопутствующее сохранение CSS-файла и ссылку на него в сохраненном HTML-файле.
3) Открываем сохраненный HTML-файл в Frontpage, переходим в режим "Split" (т.е. отображение в нижней части окна дизайна страницы, а в верхнем - исходного кода).
4) В полуокне дизайна становимся мышкой на нужный нам элемент - при этом в полуокне исходного кода курсор автоматически встанет в соответствующее место кода, а на панели тегов высветится соответствующий класс. При желании можно нажать на этот высвеченный класс - тогда в обоих полуокнах выделятся соответствующие участки.
5) Класс нам известен - теперь можно найти его в локальном CSS-файле (см. п.2 - файл был сохранен) и изменить нужным образом.
6) Возвращаемся в Frontpage, нажимаем там клавишу F5 (обновить представление) и сразу же видим и оцениваем изменения.
Если утомительно искать нужный класс в CSS, то есть
Метод 3-й - от Кински
1. Копируем название класса (с точкой или без).
2. Открываем таблицу стилей CSS
3. Вызываем окно поиска сочетанием клавиш ctrl+F
4. Вставляемый нужный класс в строку поиска
5. Нажимаем поиск и смотрим результат
В 9.01 Опере просмотр кода сделан подсвечивающимся. Текст чёрный, код синий, комментарии зелёные и скрипты коричневые. Очень удобно.
Пример:
Очень часто хотят поменять размер шрифта в сообщениях на форуме. Для этого откроем любую тему на форуме и скопируем кусочек текста. Открываем Просмотр ХТМЛ-кода и ищем этот кусочек. Затем смотрим какой у него класс - у текста сообщений class="posttdmessage".
Открываем таблицу стилей форума и находим в разделе/* Posts View */ класс posttdmessage.
.posttdmessage {padding:5px;font-size:8pt;}
Мы видим, что задан только отступ и размер шрифта. Мы можем поменять размер и добавить цвет. В итоге этот класс будет выглядеть как:
.posttdmessage {padding:5px;font-size:10pt;color:#CCCCCC;}
Цвет взят условно. [/info]
Страна: (RU)
FeStemBer
Вторник, 03 Ноября 2015 | Сообщение 5
Оффлайн
Проверенные
Сообщений:355
Награды: 1
Но так можно и делают, что код выдернуть, кроме условных операторов.
Страна: (RU)
Kolinkor
Среда, 04 Ноября 2015 | Сообщение 6
Оффлайн
Vip
Сообщений:306
Награды: 1
Отжимать любим.
Страна: (RU)
trem200
Пятница, 22 Января 2016 | Сообщение 7
Оффлайн
Проверенные
Сообщений:433
Награды: 4
Очень познавательно, спасибо.
Страна: (RU)
workman
Пятница, 22 Января 2016 | Сообщение 8
Оффлайн
Проверенные
Сообщений:1716
Награды: 9
Ну а если сжать стили то куда только денутся данные подсказки ... ))
Но большинство не пользуются этим .. А зря ..
Страна: (RU)
Форум » Web-Раздел » Начинающему вебмастеру » Разметка в CSS сайта uCoz
  • Страница 1 из 1
  • 1
Поиск: