Вопросы по CSS - [9] :: Web-программирование :: Компьютерный форум Ru.Board

Перейти из форума на сайт.

Новости • Файловые архивы
Поиск • Активные темы • Топ лист
Правила • Кто в on-line?

Вход • Забыли пароль? • Первый раз на этом сайте? • Регистрация

Компьютерный форум Ru.Board » Интернет » Web-программирование » Вопросы по CSS

Модерирует : Cheery
Версия для печати • Подписаться • Добавить в закладки
Страницы: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129

Открыть новую тему

Написать ответ в эту тему

Xrobak

Advanced Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Ссылки для самостоятельного изучения:

Теория + примеры + учебники:
• W3School: CSS Tutorial
• MDN: Cascading Style Sheets (CSS)
• WebReference: Уроки по HTML и CSS
• htmlbook: Справочник CSS
• YouTube: Основы CSS/CSS3
• CSS для JavaScript-разработчика
• Основы CSS - каскадные таблицы стилей
• Статьи по основам CSS

Применение на практике:
• StackOverflow: 'CSS' Questions
• CSS-Tricks

Первый пост темы (до включения шапки).. ··· Текущий бэкап шапки..

Всего записей: 939 | Зарегистр. 16-08-2004 | Отправлено: 18:46 27-10-2004 | Исправлено: TheBarmaley, 05:24 27-02-2019

GeMir

Ich finde dich

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Есть несколько ссылок одной строчкой. Нужно выделить одну из ссылок
курсивным начертанием и цветом. Хотелось бы узнать как можно сделать это
средствами CSS?

Всего записей: 10299 | Зарегистр. 15-02-2004 | Отправлено: 15:25 02-08-2007

evoroz Silver Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору <style type="text/css"> <!-- .it { font-style: italic; color: #0099CC; } --> </style> ..... <a href="index.htm">Link 1</a> <a href="index.htm">Link 2</a> <a href="index.htm" class="it">Link 3</a>
	Всего записей: 3491 \| Зарегистр. 30-03-2002 \| Отправлено: 16:08 02-08-2007

GeMir

Ich finde dich

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

evoroz
Спасибо. С классами я ещё не разобрался, к сожалению.

CSS:

Код:

.it {
font-style: italic;
color: #B84F4E;
}

HTML:

Код:

<a href="x.html" class="it">xxx</a>

Хм... Почему-то работает только на половину - меняет начертание на курсивное...

Всего записей: 10299 | Зарегистр. 15-02-2004 | Отправлено: 16:34 02-08-2007 | Исправлено: GeMir, 16:38 02-08-2007

Joker79

BANNED

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

GeMir, для ссылок обычно делают так:

Код:

A
    {...
    }

A:active
    {...
    }

A:visited
    {...
    }

A:hover
    {...
    }

Всего записей: 22 | Зарегистр. 13-07-2007 | Отправлено: 16:57 02-08-2007 | Исправлено: Joker79, 17:00 02-08-2007

evoroz

Silver Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

GeMir

Цитата:

Почему-то работает только на половину - меняет начертание на курсивное...

У меня твой код работает на 100%. Мой тоже.

Всего записей: 3491 | Зарегистр. 30-03-2002 | Отправлено: 16:58 02-08-2007

Joker79

BANNED

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Если же какие то ссылки необходимо выделить из всей массы, то выделяешь для них определенный класс (тот же it) и снова:

Код:

A.it
    {...
    }

A.it:active
    {...
    }

и так далее...

Всего записей: 22 | Зарегистр. 13-07-2007 | Отправлено: 16:59 02-08-2007

evoroz Silver Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Joker79 [deleted]
	Всего записей: 3491 \| Зарегистр. 30-03-2002 \| Отправлено: 17:00 02-08-2007 \| Исправлено: evoroz, 17:02 02-08-2007

GeMir

Ich finde dich

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

evoroz
У меня, почему-то, работает только код Joker79.
В итоге, получилось так:

CSS:

Код:

.it {
font-style: italic;
color: #EC4E4E;
}
a {
color: #8E9AA9;
}
a:visited {
color: #8E9AA9;
}
a:hover {
color: #AAB5C2;
}
a:active {
color: #8E9AA9;
}
a.it {
font-style: italic;
color: #EC4E4E;
}
a:visited.it {
font-style: italic;
color: #EC4E4E;
}
a:hover.it {
font-style: italic;
color: #F67777;
}
a:active.it {
font-style: italic;
color: #EC4E4E;
}

HTML:

Код:

<p><a href="xxx.html">xxx</a> <a href="xxx.html">xxx</a> <span class="it">xxx</span> <a href="xxx.html" class="it">xxx</a></p>

Всего записей: 10299 | Зарегистр. 15-02-2004 | Отправлено: 17:16 02-08-2007

Joker79

BANNED

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:

a:visited.it

Правильно a.it:visited

Всего записей: 22 | Зарегистр. 13-07-2007 | Отправлено: 17:30 02-08-2007

GeMir Ich finde dich	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Joker79 Спасибо.
	Всего записей: 10299 \| Зарегистр. 15-02-2004 \| Отправлено: 17:38 02-08-2007

Joker79 BANNED	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Ну и остальные не забудь подправить
	Всего записей: 22 \| Зарегистр. 13-07-2007 \| Отправлено: 17:41 02-08-2007

Newbie

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Имеется кусок CSS из Оперы

Код:

td[style*="background:url(/i/uho_bg.png)"] { display: none !important; }
div[id="informer1"] { display: none !important; }
div[class="popgamesbot s2"] { display: none !important; }
iframe[src="http://www.ag.ru/framer/1.html"] { display: none !important; }

Как его переделать для Greasemonkey или Stylish FireFoxa?

Всего записей: 9 | Зарегистр. 11-07-2007 | Отправлено: 11:37 04-08-2007

GeMir

Ich finde dich

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Есть следующий код:

Код:

body {
padding: 0 0;
margin: 0 0;
width: 100%;
background-color: #172734;
}
p {
padding: 0 0;
margin: 5px 40% 20px 0;
font-family: arial;
font-size: 80%;
color: #FFFFFF;
}
#navigation {
position: static;
width: 100%;
padding: 0 0;
margin: 0 0;
text-align: left;
white-space: nowrap;
background-color: #8395A3;
}

Во всех браузерах кроме Firefox навигационная панель выглядит нормально
и только в Firefox есть небольшой зазор между панелью и границей окна.
Не подскажите ли как от него можно избавиться?
Похоже, что дело в ненулевом значении margin (выделено красным) - если его обнулить, зазор исчезает.

Всего записей: 10299 | Зарегистр. 15-02-2004 | Отправлено: 23:40 15-09-2007 | Исправлено: GeMir, 23:47 15-09-2007

Member

Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору

У меня вопрос такой - необходимо сделать блок, который при малом количестве контента - определенной высоты, если больше - растягивается. Для IE работает height, для Opera и FF работает min-height, а height мешается. Как сделать просто и изящно?

Всего записей: 238 | Зарегистр. 15-07-2005 | Отправлено: 22:45 29-09-2007

Member

Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору

Цитата:

#navigation {
position: static;
width: 100%;
padding: 0 0;
margin: 0 0;
text-align: left;
white-space: nowrap;
background-color: #8395A3;
}

Как насчет добавить top:0px ?
и вообще блок с ID #navigation какого типа и куда вложен?

Всего записей: 238 | Зарегистр. 15-07-2005 | Отправлено: 12:24 30-09-2007

prostoi_stalevar

Newbie

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Подскажите, почему в IE не работает следующее:

<td width="100" align="center"><img src="images/head.jpg" border="0"/></td>

т.е. мне нужно картинку выровнять по центру ячейки, в Firefox работает, а в IE - нет.

Всего записей: 2 | Зарегистр. 11-10-2007 | Отправлено: 16:27 11-10-2007

Jokerjar79 Advanced Member	Редактировать \| Профиль \| Сообщение \| ICQ \| Цитировать \| Сообщить модератору Попробуй так <td width="100" style="text-align: center"><img src="images/head.jpg" border="0"/></td> или <td width="100"><center><img src="images/head.jpg" border="0"/></center></td>
	Всего записей: 710 \| Зарегистр. 08-09-2007 \| Отправлено: 16:59 11-10-2007

prostoi_stalevar Newbie	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Jokerjar79 Не работает
	Всего записей: 2 \| Зарегистр. 11-10-2007 \| Отправлено: 17:20 11-10-2007 \| Исправлено: prostoi_stalevar, 17:20 11-10-2007

Jokerjar79 Advanced Member	Редактировать \| Профиль \| Сообщение \| ICQ \| Цитировать \| Сообщить модератору prostoi_stalevar, хмм. Случайно, <table><tr> ... не забыл?
	Всего записей: 710 \| Зарегистр. 08-09-2007 \| Отправлено: 18:07 11-10-2007

grB

Junior Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

великие гуру CSS взываю к помощи!
есть список вида

Код:

<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>

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

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

Всего записей: 83 | Зарегистр. 16-09-2004 | Отправлено: 13:33 21-11-2007 | Исправлено: grB, 13:34 21-11-2007

Открыть новую тему

Написать ответ в эту тему

Страницы: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129

Компьютерный форум Ru.Board » Интернет » Web-программирование » Вопросы по CSS

Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC