Страница 1 из 212»
Форум про uCoz » Все для вебмастера » Начинающий Вебмастер » Маркированный список на сайте uCoz
Маркированный список на сайте uCoz
Kosten
Дата: Понедельник, 25.05.2015, 22:17 | Сообщение # 1
Администраторы
Сообщений:13777
Награды: 47


Как сделать правильно маркированный список, это к примеру. Если прописывать LI то автоматически должна быть точка. Просто вчера делал описание и так не мог понять и пришлось ставить ссылки.



Много прочитал, и понял идет по умолчанию 2 разных, это

Код
<ol>


и

Код
<ul>


Форматирование списков

Используем тэг ul обычных списков:

Код
<ul>
<li>Один из пунктов списка</li>
<li>Другой такой пункт</li>
<li>Ещё один пункт.</li>
</ul>

Заменяем тэг ul на ol и список становится пронумерованным, автоматически:

Код
<ol>
<li>Один из пунктов списка</li>
<li>Другой такой пункт</li>
<li>Ещё один пункт.</li>
</ol>


Может у кого есть информация и чтоб стили шли к ним.
Прикрепления: 6509407.jpg(5Kb)
First
Дата: Понедельник, 25.05.2015, 22:40 | Сообщение # 2
Модераторы
Сообщений:470
Награды: 16


Ну если ты именно об этом сайте так точек у тебя здесь не будет
Kosten
Дата: Понедельник, 25.05.2015, 23:19 | Сообщение # 3
Администраторы
Сообщений:13777
Награды: 47


First, я почти ночь их мутил, что бы раньше не спросить.

Можно сделать через стили, а не ссылки прописывать на картинку, которая сейчас стоит.
Kosten
Дата: Понедельник, 25.05.2015, 23:20 | Сообщение # 4
Администраторы
Сообщений:13777
Награды: 47


Цитата First ()
Ну если ты именно об этом сайте так точек у тебя здесь не будет


Хотя стрелки сделал, но они такие страшные были и по вылазили даже вид материале.
First
Дата: Вторник, 26.05.2015, 00:12 | Сообщение # 5
Модераторы
Сообщений:470
Награды: 16


Kosten, если ты пропишешь стили к li, то есть ты его откроешь, так они у тебя по вылазят по всему сайту, и в меню и в виде материалов, в общем везде где стоит этот тег, что пере корчит весь дизайн. Как вариант можно придумать что то другое, например lii biggrin
И получится у нас вот такое
Код
<ul>   
<lii>Один из пунктов списка</lii>   
<lii>Другой такой пункт</lii>   
<lii>Ещё один пункт.</lii>   
</ul>


вот взял не много переделал стили к твоему ol
Код
lii {
background:url(/Ajaxoskrip/Frank/ul-li.png) no-repeat;
   display: block;
   list-style-type: decimal;
   -webkit-margin-before: 0em;
   -webkit-margin-after: 0.5em;
   -webkit-margin-start: 40px;
   -webkit-margin-end: 0px;
   -webkit-padding-start: 20px;
}


теперь там где хочешь видеть маркер в виде картинки пишешь не li а lii biggrin

ну это то что я придумал за пару минут, но нужно посидеть подумать, может есть ещё какие то варианты, хотя и этот не тяжелый и можно настроить отступы сменить картинку и т.д smile

в общем получится тоже самое только не нужно каждый раз картинку добавлять


Сообщение отредактировал First - Вторник, 26.05.2015, 00:17
Kosten
Дата: Вторник, 26.05.2015, 01:14 | Сообщение # 6
Администраторы
Сообщений:13777
Награды: 47


First, от души и теперь красивей смотрится, так как нужно.
Kosten
Дата: Вторник, 26.05.2015, 01:21 | Сообщение # 7
Администраторы
Сообщений:13777
Награды: 47


First, придется старый ставить, так как на Mozilla Firefox, смотрится так.

Прикрепления: 5634356.jpg(48Kb)
First
Дата: Вторник, 26.05.2015, 01:21 | Сообщение # 8
Модераторы
Сообщений:470
Награды: 16


Kosten, да не за что
со стилями думаю разберешься
0.5 - это отступы между строк
20 - это отступ между картинкой и текстом
40 - это отступ от левого края
В общем выставляй как душе угодно)
First
Дата: Вторник, 26.05.2015, 01:23 | Сообщение # 9
Модераторы
Сообщений:470
Награды: 16


Цитата Kosten ()
придется старый ставить, так как на Mozilla Firefox, смотрится так.

сделай больше отступ между картинкой и текстом или попробуй пропиши пикселями и должно быть нормально
First
Дата: Вторник, 26.05.2015, 01:35 | Сообщение # 10
Модераторы
Сообщений:470
Награды: 16


Kosten, а лучше попробуй вот такими стилями
Код
lii {  
background:url(/Ajaxoskrip/Frank/ul-li.png) no-repeat;  
display: block;  
margin: 2px 10px 5px 40px;
padding-left: 20px;  
}

тоже самое только по другому написано, Mozilla должен увидеть
Kosten
Дата: Вторник, 26.05.2015, 01:38 | Сообщение # 11
Администраторы
Сообщений:13777
Награды: 47


First, отвечает за это

Код
-webkit-padding-start: 20px;


Хоть больше и меньше делай, та же ситуация.
Kosten
Дата: Вторник, 26.05.2015, 01:42 | Сообщение # 12
Администраторы
Сообщений:13777
Награды: 47


First, этот стиль отлично подошел, сейчас только заменю галочки, покрашу под сайт. И Mozilla видит отлично, то слетало в право, сейчас с отступом.
First
Дата: Вторник, 26.05.2015, 01:45 | Сообщение # 13
Модераторы
Сообщений:470
Награды: 16


Kosten,
Цитата Kosten ()
Mozilla видит отлично


Mozilla почему то коды такого типа не видит, не понятные видно ему biggrin
Код
   -webkit-margin-before: 0em;  
    -webkit-margin-after: 0.5em;  
    -webkit-margin-start: 40px;  
    -webkit-margin-end: 0px;  
    -webkit-padding-start: 20px;
Kosten
Дата: Вторник, 26.05.2015, 01:52 | Сообщение # 14
Администраторы
Сообщений:13777
Награды: 47


Может от самой системы зависит. Mozilla, это тот браузер который можно настроить, чтоб был по шустрей. Я уже не помню что нужно прописывать в поисковой полосе, чтоб раскрылся фал от браузера. И там менять, делал, не чего не изменилось. А сейчас с этими обновлениями, так вообще не работаю.
Kosten
Дата: Вторник, 26.05.2015, 01:56 | Сообщение # 15
Администраторы
Сообщений:13777
Награды: 47


А описание начал делать, просто по CEO блокам часто хожу, читаю умные статьи и нашел здесь http://www.hdsw.ru/?p=33 за эту тему, а вот стили пришлось по ресурсам ходить и искать у кого стоит так в описание и нашел один, с хрома и выдернул CSS.
Форум про uCoz » Все для вебмастера » Начинающий Вебмастер » Маркированный список на сайте uCoz
Страница 1 из 212»
Поиск: