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

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в 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

Открыть новую тему     Написать ответ в эту тему

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
evoroz



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

Цитата:
Есть ли возможность переключать CSS-файлы посредством ссылок без PHP?..

По идее через JavaScript должно реализовываться.

Всего записей: 3487 | Зарегистр. 30-03-2002 | Отправлено: 10:15 04-12-2006
ELV1S



Junior Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
GeMir
Alternative Style: Working With Alternate Style Sheets
 
А вообще, это за легко гуглом находится.

Всего записей: 153 | Зарегистр. 18-06-2005 | Отправлено: 11:56 04-12-2006
Cheery



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

Цитата:
На странице две ссылки - клик по первой, подключает 1.css, клик по второй - 2.css.

какая разница для разных или нет? я тебе пример простейший привел.
ставишь куку, потом перегружаешь страницу и в зависимости от куки цепляешь другой css файл.  
 
ну а для продвинутых можно цеплять к title.. динамически (ссылка в пред. теме). но, скорее всего, не будет работать во всех браузерах (я так цепляю для клавы js, не пашет в safari, к примеру)

----------
Away/DND

Всего записей: 52737 | Зарегистр. 04-04-2002 | Отправлено: 21:31 04-12-2006
GeMir



Ich finde dich
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Cheery
evoroz
ELV1S
Спасибо.
 
Ещё один вопрос. Есть следующий код:

Код:
ul {
    padding: 5px 100px 5px 130px;
    margin: 0 0;
    list-style-image: url(bullet.jpg);
    list-style-position: outside;
}  
li {
    padding: 5px 5px 5px 5px;
    margin: 0 0;
    font-family: arial;
    font-size: 80%;
    color: #FFFFFF;
}

В Internet Explorer он работает так (маркер вверху текста):
 
   
 
В Opera так (маркер вверху текста):
 
   
 
А в Firefox так (маркер внизу текста):
 
   
 
Как сделать так, чтобы в этих трёх браузерах маркер находился
в одинаковом положении относительно текста а именно - по центру?

Всего записей: 10296 | Зарегистр. 15-02-2004 | Отправлено: 04:40 04-01-2007
evoroz



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

Цитата:
list-style-image: url(bullet.jpg);

А каковы размеры картинки?

Всего записей: 3487 | Зарегистр. 30-03-2002 | Отправлено: 04:57 04-01-2007
Mistake2

Gold Member
Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
Проблема вот в чем: есть меню, у которой закладки меняют свое расположение относительно центральной линии в зависимости от активности. Т.е. если закладка активна, то она показывается сверху, все остальные снизу, ни и т.д. В IE все отображается отлично, однако в Opera все меню уезжает вверх на логотип  
Как можно исправить?
 
 

Код:
 
#header
{
    margin: 0;
    padding: 0;
    width: 800px;
    height: 120px;
    background: #4e959b url('../images/top02.jpg') no-repeat top center;
}
 
#menu
{
 
    float: none;
    margin: 92 0 0 0px;
    padding: 0 0 0 130px;
    height: 56px;
    display: block;
    font-size: 10px;
}
 
#menu li
{
    display: block;
    text-align: center;
    float: left;
    list-style: none;
}
 
#menu li a
{
    background-image: url('../images/menu_top.jpg');
    color: #000;
    text-decoration: none;
    font-weight: 700;
    display: block;
    width: 90px;
    height: 23px;
    background-position: 0 23px;
    border: 0px none; margin-left: 2px; margin-right: 2px; margin-top:28px; margin-bottom:0; padding-left:0; padding-right:0; padding-top:5px; padding-bottom:0  
}
 
#menu li.active a, #menu li.active a:hover
{
    color: #000;
    margin: 5px 0 21px 0px;
    padding: 6px 0 0 0;
    padding-top: 5px;  
    height: 23px;
    background-position: 0 0;
}
 
#menu li a:hover
{
    background-position: 0 49px;
}
 



----------
Freedom of Choice (c) A Perfect Circle

Всего записей: 7506 | Зарегистр. 18-02-2006 | Отправлено: 12:15 04-01-2007
GeMir



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

Цитата:
А каковы размеры картинки?

5x5 пикселов.

Всего записей: 10296 | Зарегистр. 15-02-2004 | Отправлено: 16:50 04-01-2007
evoroz



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

Цитата:
5x5 пикселов

Может сделать ее 12х5? И гиф.
12 - высота строки. Если что, и размер шрифта 12px.  

Всего записей: 3487 | Зарегистр. 30-03-2002 | Отправлено: 18:09 04-01-2007
GeMir



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

Цитата:
12 - высота строки. Если что, и размер шрифта 12px.

По-моему, не выход: cтоит измениться высоте строки (размеру шрифта)
и понадобится новая картинка.

Всего записей: 10296 | Зарегистр. 15-02-2004 | Отправлено: 18:15 04-01-2007
evoroz



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

Цитата:
cтоит измениться высоте строки (размеру шрифта)  
и понадобится новая картинка

Я поэтому и предлагаю фиксировать размер шрифта.
 

Всего записей: 3487 | Зарегистр. 30-03-2002 | Отправлено: 01:11 05-01-2007
GeMir



Ich finde dich
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
evoroz
А мне не нужен фиксированный размер шрифта

Всего записей: 10296 | Зарегистр. 15-02-2004 | Отправлено: 01:22 05-01-2007
Teze

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

Извините, почему не могу создать новую тему?  ( не нашел кнопку, есть возможность только ответить в темах )
 
 

Всего записей: 17 | Зарегистр. 06-06-2006 | Отправлено: 12:42 05-01-2007
Mistake2

Gold Member
Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
Teze
Ты еще не достиг 10 сообщений!
 
evoroz
С моей проблемой помочь не можешь?

----------
Freedom of Choice (c) A Perfect Circle

Всего записей: 7506 | Зарегистр. 18-02-2006 | Отправлено: 13:35 05-01-2007
Teze

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

Gemir, а почему делаешь с image? Там можно и без image обойтись, зачем грузить всякими картинками то, что делается легко?  
 
 
Mistake, спасибо.
 
 
 
Добавлено:
 
GeMir , если ОЧЕНЬ нужно именно с твоей картинкой - попробуй сделать общий background для ul = никаких проблем в броузерах не будет )
 
 
 
Добавлено:
Вот пример, работает на всех броузерах четко:
 
 
   <style type="text/css">
<!--
body {
        font-family: Verdana, Arial, Helvetica, sans-serif;
        margin: 0;
        font-size: 80%;
        font-weight: bold;
        background: #FFF;
        }
 
h2 {
        font: bold 14px Verdana, Arial, Helvetica, sans-serif;
        color: #000;
        margin: 0px;
        padding: 0px 0px 0px 15px;
}
 
ul {
        list-style: none;
        margin: 0;
        padding: 0;
        }
 
img {
    border: none;
}
 
 
/*- Menu 2--------------------------- */
 
#menu2 {
        width: 200px;
        margin: 10px;
        border-style: solid solid none solid;
        border-color: #D8D5D1;
        border-size: 1px;
        border-width: 1px;
        }
 
#menu2 li a {
        height: 32px;
          voice-family: "\"}\"";
          voice-family: inherit;
          height: 24px;
        text-decoration: none;
        }
 
#menu2 li a:link, #menu2 li a:visited {
        color: #3688BA;
        display: block;
        background:  url(menu2.gif);
        padding: 8px 0 0 32px;
        }
 
#menu2 li a:hover, #menu2 li #current { {
        color: #3688BA;
        padding: 8px 0 0 32px;
        }
-->
</style>
        </head>
 
        <body>
                <h2>Привет Gemiru</h2>
                <div id="menu2">
                        <ul>
                                <!-- CSS Tabs -->
<li><a id="current" href="1.html">Элемент списка 1</a></li>
<li><a href="2.html">Элемент списка 2</a></li>
<li><a href="3.html">Элемент списка 3</a></li>
<li><a href="4.html">Элемент списка 4</a></li>
<li><a href="5.html">Элемент списка 5</a></li>
<li><a href="6.html">Элемент списка 6</a></li>
<li><a href="7.html">6ой элемент</a></li>
 
                        </ul>
                </div>
 
Добавлено:
 
menu2.gif  - готовый есть, только не знаю как на форум загрузить ) но делается легко:  width сделай в ширину меню, сделай транспарент, и круг ставь где хочешь )
 

Всего записей: 17 | Зарегистр. 06-06-2006 | Отправлено: 14:13 05-01-2007
GeMir



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

Цитата:
почему делаешь с image?

Потому что.

Цитата:
Там можно и без image обойтись

Но мне нужно именно с image.

Цитата:
 попробуй сделать общий background для ul

Ты это о чём?..

Всего записей: 10296 | Зарегистр. 15-02-2004 | Отправлено: 14:32 05-01-2007
Teze

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

GeMir, см. выше примерный код, там с background. Вместо того, чтоб готовые файлы копировать, надо и самому немного думать, ведь и до меня подсказали как можно сделать.
 

Всего записей: 17 | Зарегистр. 06-06-2006 | Отправлено: 14:39 05-01-2007
GeMir



Ich finde dich
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Teze
Мне не подходят варианты, предложенные evoroz - это раз.
Мне не нужно меню, меню нужно Mistake2 - это два.
В твоём коде интересным для меня многло бы быть это:

Код:
ul {  
        list-style: none;  
        margin: 0;  
        padding: 0;  
        }

...и это:

Код:
#menu2 li a:link, #menu2 li a:visited {  
        color: #3688BA;  
        display: block;  
        background:  url(menu2.gif);  
        padding: 8px 0 0 32px;  
        }

Однако, этот способ мне так же не подходит (потому что мне не подходят
способы из разряда "через ****** к звёздам") - это три.

Всего записей: 10296 | Зарегистр. 15-02-2004 | Отправлено: 15:42 05-01-2007
evoroz



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

Цитата:
С моей проблемой помочь не можешь?

Я просто не понимаю, что у тебя происходит. Дай ссылку на страницу или часть кода страницы.

Всего записей: 3487 | Зарегистр. 30-03-2002 | Отправлено: 21:17 05-01-2007
Teze

Newbie
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
GeMir , а ты сам вобще думать отказываешься, ждешь пока форумчане тебе готовый код выставят?  Тут никто не будет тебе миллион вариантов предлагать, пока тебе не понравиться хоть какой. Достаточно советов и примеров - на том примере все для менюшки, но раз уж ты прекрасно понимаешь какой вариант тебя устраивает, то можешь из примерного кода сделать оптимальный вариант, так же воспользоваться советом, что выше.  
 
Пусть чайники читают FAQ по CSS прежде чем сайты делать, а гуру - им достаточно и совета и примерного кода )
 
Добавлено:
 
Еще один вариант:  http://www.webmascon.com - меню слева как раз правильно составлен. Вот тебе и пример.  
 
Если еще и после этого будешь выступать, оставлю тебе линк на FAQ для чайников
 
Добавлено:
Ну там слева меню вобще нет, я имед ввиду менюшку справа )))
 
 
 
CHERRY , ok, только что заметил. Будем знать.
 
 





Не надо "ля-ля" без причины.. на это есть флейм.
Плюс хочешь исправить свой пост - жми кнопку "редактировать" /Cheery/
ps: не нужно вставлять лишние переносы - читабельность поста сильно нарушается

Всего записей: 17 | Зарегистр. 06-06-2006 | Отправлено: 21:48 05-01-2007 | Исправлено: Teze, 01:17 06-01-2007
iogun



Full Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Подскажите как сформировать такие списки  
 
1.    
   1.1  
   1.2  
   1.3  
        1.3.1  
        1.3.2
        1.3.3
   1.4
2.
3.
....  
   
 
Вот так вроде работает
 

Цитата:
 
<style>
OL { counter-reset: item }
LI { display: block }
LI:before { content: counters(item, "."); counter-increment: item }
 

 
но только в Opera, а в IE6 1.1. заменяется на 1, а 1.2. на 2, т.е. отсутствует родительская цифра. Почему?

Всего записей: 477 | Зарегистр. 31-08-2004 | Отправлено: 20:37 18-01-2007 | Исправлено: iogun, 21:45 18-01-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

Компьютерный форум 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

Рейтинг.ru