Стили и дизайн (Статей: 10)

Купить VPN
Профессиональная разработка сайта
Фото с телефона до/после обработки [+]
Горячие клавиши Photoshop
+1
Многие комбинации могут быть вам уже известны.

Ctrl + A - выделить ВСЕ
Ctrl + C - копировать
Ctrl + V - вставить
Ctrl + N - новый документ
Shift + Ctrl + N - новый слой

Ctrl + S - сохранить
Shift + Ctrl + S - сохранить как...
Alt + Shift + Ctrl + S - сохранить для Web
Ctrl + Z - вернуть назад
Alt + Ctrl + Z - вернуть на несколько шагов назад
Shift + Ctrl + Z - вернуть на шаг вперед

Ctrl (-) - уменьшение изображения
Ctrl (+) - увеличение изображения
Alt +...
Автор: (20.12.2016 / 15:15)
Просмотры: 695
Комментарии (0) »
Прячем иконки в фон
+1
Здравствуйте!
Наверное многим не нравится когда с их сайта что-то "копипастят".
Сейчас я вам расскажу как усложнить копирование графики (а именно иконок) с помощью css.
Все наши иконки будут вида
<i class="icon-ICON_NAME "></i>
.
Сначала создадим файл icons.css и подключим его к сайту.
В этом файле пропишем:
[color=#0000ff][class^="icon-"],[class*=" icon-"] {
width: 16px;
height: 16px;
display: inline-block;
vertical-align: text-top;
}[/color]
где

width: 16px; - ширина иконки
height: 16px; - высота иконки

и далее уже создаем див самой иконки:
.icon-icon_name {
background: url(путь к иконке) no-repeat;
}
Затем icons.css можно собрать с основным стилем и прогнать его через сервис...
Автор: (09.10.2013 / 19:59)
Просмотры: 944
Комментарии (0) »
Фиксированная ширина wap-шабона
+4
В этой статье хочу поднять тему фиксированных по ширине wap-дизайнов.
Если не ошибаюсь, вопрос подобный не поднимался ни кем ранее, а следовало бы.
Сколько точно процентов сайтов используют фиксированные по ширине шаблоны я не считал, могу лишь предположить что это число весьма велико, около 80% (в Российском сегменте мобильного интернета).
Почему так вышло? Так удобнее сидеть на мобильном сайте с компьютера.
Но отдавая приоритет ПК при создании дизайна для мобильного дизайна мы совершенно наплевательски относимся к пользователям мобильных устройств.
Как правило атрибут max-width в CSS варируется, но присутствует.
Достигает 480px, возможно больше, но это редкость.
Раньше, года 3 тому назад...
Автор: (15.11.2011 / 18:54)
Просмотры: 1759
Комментарии (3) »
Свойство opacity - прозрачность
0
Значение прозрачности действует на все дочерние элементы внутри, а не только на фон.
Диапазон значения: от 0 до 1
Чем ближе к 1 - тем прозрачнее.
Попробуйте поэкспериментировать с этим свойством используя его при наведении (hover).
Автор: (13.11.2011 / 01:01)
Просмотры: 1034
Комментарии (2) »
Памятка по CSS
-1
CSS Crib Sheet
При верстке сайта с помощью CSS вы обязательно наткнетесь на множество проблем. И всякий раз вы будете биться головой об стену в попытках обойти очередной глюк. Данный документ призван облегчить вам процесс разработки, и служит кратким справочником, к которому вы можете обращаться всякий раз, когда столкнетесь с непреодолимым препятствием.

Если у вас есть что добавить к этому документу, оставьте свой комментарий здесь.

Данный документ переведен на французский, немецкий, испанский, итальянский, венгерский, финский, русский, японский и китайский языки.

Что-то не так? Проверьте код валидатором!
При отладке своего кода вы сэкономите уйму времени и нервов, если в первую очередь...

Автор: (08.06.2011 / 16:29)
Просмотры: 1318
Комментарии (1) »
Выпадающие меню с помощью CSS
+3
Drop-Down Menus, Horizontal Style
Каждый, кому доводилось создавать выпадающие меню, знаком с тем, какое количество скриптов требуется для этого. Между тем, используя грамотно структурированный HTML-код и несложные CSS-правила, можно создать симпатичное выпадающее меню, которое легко менять и дополнять, и при этом оно будет работать во множестве браузеров, в том числе и в Internet Explorer. И самое главное для вас, любители "чистого" кода - никакого JavaScript! (На самом деле, небольшой скрипт все же необходим, но вовсе не для того, о чём вы подумали.)
Вот пример меню:
http://www.alistapart.com/d/horizdropdowns/horizontal.htm
Создаем меню
Первым и самым важным этапом создания нашего меню является построение его структуры....
Автор: (08.06.2011 / 16:28)
Просмотры: 1446
Комментарии (3) »
Посещенные ссылки. Visited links
0
Все в гиперпространстве связанно между собой гиперссылками. Почти каждый переход с одной страницы на другую страницу подразумевает предварительный щелчок мышью по определенной ссылке. Как дать посетителю сайта знать о том, что он уже посещал страницу, на которую ведет определенная ссылка?

Известно достаточно много методов для того, чтобы дать пользователю знать о том, что он уже посещал конкретную страницу в интернете. Какой из этих методов самый подходящий? Цветовое определение ссылок? Подчеркивание? Картинка? При ответе на этот вопрос не стоит забывать о дальтониках, о карманных компьютерах, и, конечно же, не стоит забывать о браузерах, вернее браузере - всеми любимый ослик - Internet...

Автор: (08.06.2011 / 16:21)
Просмотры: 1288
Комментарии (1) »
Малоизвестные полезности в css
+34
Сразу оговорюсь: формулировка у меня хреновая, но надеюсь что смысл написанного ниже дойдет до читателя))

Как-то просматривая стиль на одном сайте, наткнулся на строчку вида
input { применение стиля }.
Столкнулся с таким впервые, и ессно начал методом тыка разузнавать подробней.

В итоге:
Можно разукрасить поля ввода.
К примеру на венике гостевая. Там при добавлении сообщения три поля ввода, имена которых author (ник), message (сообщение) и code (код с картинки).
Пишем в стиле:
input {background-image: url("/dir/.../image.gif"); background-repeat: no-repeat /*чтоб картинка не повторялась, ибо смотреться хреново будет*/ }
Подробней:
В стиле указано input {...}
То есть если в html коде страницы...
Автор: (23.09.2010 / 03:18)
Просмотры: 2478
Комментарии (11) »
Единици измерения
+9
px Пикселы

cm Сантиметры

mm Миллиметры

pt Пункты (типограф.)

% Проценты
Автор: (05.07.2010 / 12:32)
Просмотры: 1457
Комментарии (8) »
Введение
+3
Основным понятием CSS
является стиль – т. е. набор
правил оформления и
форматирования , который
может быть применен к
различным элементам
страницы . В стандартном HTML
для присвоения какому-либо
элементу определенных
свойств (таких, как цвет,
размер, положение на
странице и т. п.) приходилось
каждый раз описывать эти
свойства , даже если на одной
страничке должны
располагаться 10 или 110
таких элементов, ничуть не
отличающихся один от
другого . Вы должны были
десять или сто десять раз
вставить один и тот же кусок
HTMLкода в страничку ,
увеличивая размер файла и
время загрузки на компьютер
просматривающего ее
пользователя . CSS действует...
Автор: (05.07.2010 / 08:58)
Просмотры: 1423
Комментарии (5) »
Топ статей / Облако тегов / Поиск / Авторы