Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770
Форумы портала PHP.SU :: Версия для печати :: css правило плюс один
Форумы портала PHP.SU » Клиентская разработка » HTML, Дизайн & CSS » css правило плюс один

Страниц (1): [1]
 

1. sanj - 20 Ноября, 2010 - 18:28:10 - перейти к сообщению
В общем такое дело:
есть сайт на ворд прессе и под хедером есть меню.
И в этом меню есть разделение между пунктами - например:
графический рисунок разделитель - главная - графический рисунок разделитель - услуги - разделитель и так далее.

т.е. этот разделитель идет перед пунктом меню.

вот как это реализовано :

CODE (html):
скопировать код в буфер обмена
  1.                         <li class="page_item page-item-16 current_page_item"><a href="" title="главная">Главная</a></li>
  2. <li class="page_item page-item-2"><a href="/uslugi" title="Наши услуги">Услуги</a></li>
  3.  


вот css правило

CODE (html):
скопировать код в буфер обмена
  1. #menu ul li a {
  2.         display: block;
  3.         float: left;
  4.         padding: 0 45px;
  5.         line-height: 42px;
  6.         background: url(bg_menu_.gif) no-repeat 0 0;  /* вот этот графический разделитель*/
  7.         color: #fff;
  8. }


И хотелось бы перед самым первым пунктом меню не отображать графический разделитель. Подскажите как это реализовать.
2. JustUserR - 20 Ноября, 2010 - 18:43:27 - перейти к сообщению
sanj пишет:
И хотелось бы перед самым первым пунктом меню не отображать графический разделитель. Подскажите как это реализовать
В качестве возможного варианта предпоженной вами задачи включающей в себя предотвращение отображения раздилителя пункта меню перед его первичным элементом - возможно использование отделенного CSS-стиля для этого элемента который может быть определен посредством определения позиции в DOM-модели - средсвами JS-скрипта или генерирующего PHP-скрипта
3. sanj - 20 Ноября, 2010 - 18:53:50 - перейти к сообщению
Вот само создание этого меню

PHP:
скопировать код в буфер обмена
  1.         <div id="menu">
  2.                 <ul>
  3.                         <?PHP if (is_page()) { $highlight = "page_item"; } else {$highlight = "page_item current_page_item"; } ?>
  4.                        
  5.                         <?PHP wp_list_pages('sort_column=menu_order&depth=1&title_li='); ?>
  6.                        
  7.                        
  8.                 </ul>
  9.         </div>
  10.  


Как тут отдельный слой можно сооздать.
А вообще мозможно отменить действие правила для начала, а все последующее будет подчиняться правилу?
4. ALEN - 20 Ноября, 2010 - 20:27:31 - перейти к сообщению
Кто мешает 2ксс правила написать, и первое применять только к первому аргументу?
5. JustUserR - 21 Ноября, 2010 - 20:55:03 - перейти к сообщению
sanj пишет:
Вот само создание этого меню
В общем случае генерация используемого вами навигационного меню включает в себя базовый цикл выбора целевого элемента - в таком случае возможна реализация отдельного блока программного кода для обработки первого элемента
6. Viper - 22 Ноября, 2010 - 08:00:49 - перейти к сообщению
CODE (htmlphp):
скопировать код в буфер обмена
  1. #menu ul li:first-child {
  2.         background: none;
  3. }

учтите что не будет работать в IE
7. Phantik - 22 Ноября, 2010 - 12:02:05 - перейти к сообщению
Через CSS это сделать очень просто.
Нету желания и времени разбирать конкретно ваш случай, но аналогичная конструкция работает стабильно:

/* Тут прописаны стили для всех элементов списка */
.horizList li {display:inline; padding:0 3px 0 3px; font-size:12px; font-weight:bold}
/* Тут прописаны стили для всех элементов кроме первого */
.horizList li+li { border-left:solid; border-left-color:black; border-left-width:1px;}

для кода вида
<ul class="horizList">
<li>....</li>
<li>....</li>
....
</ul>

Перед первым пунктом не ставит палочку.

Для своего случая попробуйте сделать аналогично.
8. JustUserR - 22 Ноября, 2010 - 20:41:56 - перейти к сообщению
Viper пишет:
Учтите что не будет работать в IE
В качестве обобщенного варианта решения вопроса по модификации отображения выделенного по заданному критерию элемента - возможно использование JS-скрипта осуществляющего анализ компонентого расположения элемента в DOM-модели и выполнения требуемого CSS-стилизирования
Кроме того клиентские приложения браузера Interner explorer версии 8 и 9 обеспечивают поддержку указанного вами режима CSS-стилизирования - однако использование такого подхода не является эффективным или универсальным
9. Viper - 24 Ноября, 2010 - 09:10:29 - перейти к сообщению
JustUserR пишет:
В качестве обобщенного варианта решения вопроса по модификации отображения выделенного по заданному критерию элемента - возможно использование JS-скрипта осуществляющего анализ компонентого расположения элемента в DOM-модели и выполнения требуемого CSS-стилизирования
Кроме того клиентские приложения браузера Interner explorer версии 8 и 9 обеспечивают поддержку указанного вами режима CSS-стилизирования - однако использование такого подхода не является эффективным или универсальным


что быстрее? JS+перебор DOM либо разбор CSS правила браузером?
В IE 8 правило не работает. В IE 9 скорее всего тоже не будет.
10. JustUserR - 24 Ноября, 2010 - 18:07:34 - перейти к сообщению
Viper пишет:
Что быстрее? JS+перебор DOM либо разбор CSS правила браузером?
Возможность применения заданного CSS-правила к отображаемому компоненту клиентской страницы производится посредством осуществления расчета параметров целевого элемента такую как вложенность в контейнер и текущее состояние - и последующее применение к нему операций по модификации отображения Браузер Internet explorer 8 и более старших версий обеспечивает возможность собственной программной реализации указанного механизма - в том числе фактическое переопределение DOM properties и осуществление предваряющего обработки отображения реального времени - по этой причине вычислительные затраты предполагаемые обеими случаями являются эквивалентными

 

Powered by ExBB FM 1.0 RC1