X   Сообщение сайта
(Сообщение закроется через 3 секунды)


 

Здравствуйте, гость ( Вход | Регистрация )

2 страниц V   1 2 >
Открыть тему
Тема закрыта
> Как сделать рамку вокруг "содержания"?
snigorin
snigorin
Topic Starter сообщение 11.1.2016, 16:18; Ответить: snigorin
Сообщение #1


Всем привет, вот собираюсь ставить оглавление ко всем статьям, поставил только пока здесь. Как мне вокруг него сделать рамку? Какой код прописать и куда? 
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ShowPrint
ShowPrint
сообщение 11.1.2016, 17:34; Ответить: ShowPrint
Сообщение #2


efros, "обернуть" оглавление в отдельный блок со своим стилем в котором и прописать рамку.

Например:
HTML:

<div id="oglavlenie">
<p>Из этой статьи вы узнаете:</p>
<a href="#a1"><li>Сухая чистка ковролина</a><br>
<a href="#a2"><li>Влажная чистка ковролина</a><br>
<a href="#a3"><li>Как очистить ковролин от пятен с помощью народных средств?</a>
</div>

CSS:

#oglavlinie {border:1px solid black;}
#oglavlinie p{font-weight:bold;}

Что-то вроде этого...
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
snigorin
snigorin
Topic Starter сообщение 11.1.2016, 18:13; Ответить: snigorin
Сообщение #3


(ShowPrint @ 11.1.2016, 19:34) *
CSS: #oglavlinie {border:1px solid black;} #oglavlinie p{font-weight:bold;}
Впихнул это в css, но что-то не работает. Это в определенное место нужно или в любое? 
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ShowPrint
ShowPrint
сообщение 11.1.2016, 18:22; Ответить: ShowPrint
Сообщение #4


efros, просмотрел сразу, а что там теги <li> делают?

И исправь (очепятался: написал "i" вместо "e") CSS:

#oglavlenie {border:1px solid black;}
#oglavlenie p{font-weight:bold;}

PS Теги списка наверное можно убрать, тем более что объявления списка не нашел в коде при поверхностном изучении фрагмента


Сообщение отредактировал ShowPrint - 11.1.2016, 18:25
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
snigorin
snigorin
Topic Starter сообщение 11.1.2016, 18:29; Ответить: snigorin
Сообщение #5


ShowPrintShowPrint, Теги li для списка как я понял. 

Вот вставил между этим и все ровно не получается. 



}
.breadcrumb, .breadcrumb> div, .breadcrumb .fa-caret-right, .breadcrumb .root a {
float: none;
#oglavlenie {border:1px solid black;}
#oglavlenie p{font-weight:bold;}
}
.breadcrumb .root {
padding: 0;
}

Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ShowPrint
ShowPrint
сообщение 11.1.2016, 18:44; Ответить: ShowPrint
Сообщение #6


Попробуйте тогда без CSS, просто в HTML:

<div style="border: 1px solid black;">
<p style="font-weight:bold;">Из этой статьи вы узнаете:</p>
<a href="#a1">Сухая чистка ковролина</a><br>
<a href="#a2">Влажная чистка ковролина</a><br>
<a href="#a3">Как очистить ковролин от пятен с помощью народных средств?</a>
</div>

efros, а зачем внутри фигурных скобок вставили????

Надо было так сделать:

}
.breadcrumb, .breadcrumb> div, .breadcrumb .fa-caret-right, .breadcrumb .root a {
float: none;
}
#oglavlenie {border:1px solid black;}
#oglavlenie p{font-weight:bold;}
.breadcrumb .root {
padding: 0;
}


А так как вы написали - в одни стили вписали другие, а никак не "между"... )))
(efros @ 11.1.2016, 20:29) *
Теги li для списка
Они должны быть обернуты в пару тегов ul... 


Сообщение отредактировал ShowPrint - 11.1.2016, 18:41
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
snigorin
snigorin
Topic Starter сообщение 11.1.2016, 19:08; Ответить: snigorin
Сообщение #7


ShowPrint, спасибо, получилось, буду теперь настраивать. Но вот не понял как правильно список сделать. Это в начале должны быть теги li, а в конце ul?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ShowPrint
ShowPrint
сообщение 11.1.2016, 19:16; Ответить: ShowPrint
Сообщение #8


efros, зря поставили фиксированную ширину блока - адаптивность нарушается... Можно попробовать вместо задания ширины поставить 

display:inline-block;

а также поиграть стилями margin и padding как самого блока, так и вложенных элементов...

И совет: пытайтесь разбираться как с css, так и с html - очень полезное знание при сайтостроительстве.

Правильное оформление маркированных списков делается так:

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

Ссылка на матчасть: ...тынц...

И стили прописывать лучше всё-таки через css (когда возможно), чтоб код был "чистый", без style...
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
snigorin
snigorin
Topic Starter сообщение 11.1.2016, 19:33; Ответить: snigorin
Сообщение #9


ShowPrint, Про блок я понял как делать, а вот с вложенными элементами, особенно с ссылками вообще не понял, вот хотел отступить от края и прописал 

<p style="margin: 5px;"<a href="#a1">Сухая чистка ковролина</a><br></p> 

Но ссылка убралась и ничего не произошло

Аааа, докумекал.  padding ))
ShowPrint, хотел еще поинтересоваться, а закрывать это все в noindex или nofollow нужно? А то как бы повторяются заголовки. Как думаете? 


Сообщение отредактировал efros - 11.1.2016, 19:26
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
ShowPrint
ShowPrint
сообщение 11.1.2016, 19:36; Ответить: ShowPrint
Сообщение #10


efros, а зачем ссылку обернули в тег <p>?

Экспериментируйте и изучайте - опыт вещь бесценная...

(ShowPrint @ 11.1.2016, 21:16) *
стили прописывать лучше всё-таки через css
 
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
2 страниц V   1 2 >
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Как набрать 10 000 минут просмотра в Яндекс Дзене и начать зарабатывать от 50 000 рублей
Разбираем детально Яндекс Дзен на примере кейса
0 r0mZet 60 Сегодня, 17:30
автор: r0mZet
Горячая тема (нет новых ответов) Как перестать толстеть?
226 DocAnton64 16778 Сегодня, 16:20
автор: EvilGomel
Горячая тема (нет новых ответов) Тема имеет прикрепленные файлыMail.ru как поисковик
скорее жив?
82 Osipec 17508 Вчера, 22:55
автор: WGN
Открытая тема (нет новых ответов) Как максимально удобно принимать оплату?
желательно анонимно
18 Wachowski 2557 Вчера, 14:26
автор: kira_niko
Горячая тема (нет новых ответов) Яндекс деньги и запрет коммерческой деятельности, как понять?
33 Webranger 2933 Вчера, 1:50
автор: Rniro_1337


 



RSS Текстовая версия Сейчас: 25.2.2021, 21:11
Дизайн