Dec 07

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

Вот один из примеров добавления поста в ЖЖ. Вы можете подставить свое изображение/иконку.

<a rel="nofollow" href="http://www.livejournal.com/update.bml?event=<?php the_permalink(); ?>&subject=< ?php the_title(); ?>" target="_blank" title="Добавить в livejournal.com">
     <img src="http://www.livejournal.ru/i/head/logo.gif" alt="" />
</a>
Jun 25

CSS-свойство text-shadow позволяет создавать текст тени, т. е. немного смещенные, слегка размытые копии текста. А также существует возможность изменения цвета тени и радиуса размытия. Я думаю, что данное свойство может быть полезно при создании крупных проектов.

Вот пример:

p.test {
	text-shadow: #6374AB 20px -12px 2px;
}

Рассмотрим пример более подробно:
1. Первый параметр – #6374AB – цвет тени.
2. Второе значение – 20px – смещение тени по горизонтали. Можно с помощью отрицательного значения изменять положение тени по оси Х.
3. Третье значение – -12px – смещение тени по вертикали. В данном случае можно варьировать и задавать отрицательное значение расположения тени по оси Y.
4. Четвертое значение – 2px – размытие тени.

P.S. В браузере Internet Explorer данное свойство не работает.

Jun 19

В этой статье содержится несколько советов по улучшению кода css. В блочной верстке основное – это чистый и понятный html/css. Не будем откладывать в долгий ящик и приступим к делу.

1. CSS шрифт – правильное сокращение.

При записывании свойств шрифта в файл css, вы можете указывать каждое свойство в отдельности (как показано в примере ниже)

font-size: 1em;
line-height: 1.5em;
font-weight: bold;
font-style: italic;
font-variant: small-caps;
font-family: verdana,serif;

Но вы также можете воспользоваться сокращенной записью:

font: 1em/1.5em bold italic small-caps verdana,serif;

Если вы не укажете какой-либо из параметров, будет срабатывать значение по умолчанию. Например, если не писать bold, тогда срабатывает параметр по умолчанию – normal

2. IE игнорирует !important

Как правило, в зависимости от того, какое свойство CSS указано последним, то и имеет преимущество. Но, если вы используете !important после необходимого свойства, то эта команда CSS будет иметь приоритет. Это работает во всех браузерах, кроме IE.

Примером этого может быть:

margin-top: 3.5em!important;
margin-top: 2em;

Таким образом, верхнее поле будет установлено в 3.5em для всех браузеров, кроме IE, у которого верхнее поле будет равно 2em.

Также не стоит забывать, что псевдоклассы (например, :first-child который является первым дочерним элементом какого-либо другого элемента) для браузера IE также не работают.

Jun 18

Так как определённое количество людей все же продолжает подстраиваться под ie6, не могу не остановиться на этом вопросе.
В этой статье описаны методы подключения CSS-стилей для различных версий браузера Internet Explorer.

В теге head в HTML добавляем комментарий:

1. Стили только для IE

<!--[if !IE]>
<link rel="stylesheet" type="text/css" href="ie.css" />
< ![endif]-->

2. Только IE 6

<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
< ![endif]-->

3. В данном случае lte обозначает «меньше или эквивалентно», т.е. комментарий будет работать для IE 7 и более ранних версий.

<!--[if  IE 7]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
< ![endif]-->

Также при верстке иногда возникает необходимость в использовании хаков для ie6 и ie7.

Для IE6 к элементу, значения которого нуждаются в корректировке, нужно добавить *html

*html #page{
    padding:25px 0;
}

или

*html #page{
    _padding:25px 0;
}

Для корректного отображения в IE7, нужно добавить *+html:

* +html #page{
    padding:25px 0;
}
Страница 1 из 612345»...В конец »