Кто давно читает мои шпаргалки, наверно обратили внимание,что коды я выделяю разными способами.
Вот так будет выглядеть этот скролл и работу его посмотреть можно

Так что если вам понравился этот вариант давайте начнём. Заходим в ШАБЛОН-ИЗМЕНИТЬ HTML находим строку. Как это легко сделать прочитайте здесь. И над ней вставляем следующий код
#lightbdrs-code {
width: 400px;
margin: 10px auto;
overflow: auto;
height: 200px;
padding:0 20px;
background-color:#4E4E4E;
border:solid #0099FF 3px;
box-shadow:0 0 10px 2px #000 inset;
background: url(http://2.bp.blogspot.com/-Z0NQ5NxNkmE/UjSXktAKEEI/AAAAAAAAByM/AGe4VEHPfJw/s1600/bg.png);
}
#lightbdrs-code:hover {
border-color: #333;
box-shadow:0 0 5px 2px #000 ;
}
#lightbdrs-code code {
font-size : 12px;
color : #000000;
font-family: "Courier New", Courier, monospace;
line-height: 20px;
font-weight: bold;
}
width: 400px;
margin: 10px auto;
overflow: auto;
height: 200px;
padding:0 20px;
background-color:#4E4E4E;
border:solid #0099FF 3px;
box-shadow:0 0 10px 2px #000 inset;
background: url(http://2.bp.blogspot.com/-Z0NQ5NxNkmE/UjSXktAKEEI/AAAAAAAAByM/AGe4VEHPfJw/s1600/bg.png);
}
#lightbdrs-code:hover {
border-color: #333;
box-shadow:0 0 5px 2px #000 ;
}
#lightbdrs-code code {
font-size : 12px;
color : #000000;
font-family: "Courier New", Courier, monospace;
line-height: 20px;
font-weight: bold;
}
Теперь, когда вы захотите скрыть часть текста или кода вам понадобиться просто вставить в нужное место вот это-
<div style="background:#fff; width:460px;margin: 10px auto;height: 227px;padding:1px ;box-shadow:0 0 10px 2px #000 inset;border-radius:10px; ">
<div id="lightbdrs-code">
<code>
здесь ваш текст
</code></div></div>
Как это сделать. Перейдите в редакторе сообщений в режим HTML
И вместо текста , который я выделила красным цветом вставляйте то, что задумали. Хочу дать небольшой совет. Последний код лучше всего сохранить у себя в блокноте или в черновике в сообщениях. Все значения в этом коде которые выделены зелёным при желании можно поменять.
Обращаю ваше внимание ещё на один момент. Во время написания сообщения выглядеть это будет так

Пусть это вас не смущает. При просмотре и публикации всё будет в надлежащем виде.
Если будут вопросы обращайтесь. На этом в сегодняшней шпаргалке поставим точку.
хотите оформить подписку на новые шпаргалки
Та-ак, еще подкинула тему для размышлений))) Как это все освоить?
ОтветитьУдалитьИрина, с твоим упорством возможно всё. Спасибо за комментарий.
ОтветитьУдалитьЗначит упираюсь по сильнее и... начинаю думать)
ОтветитьУдалитьДобрый вечер, Вика! Когда я в коде меняю размеры, меняется только внешняя серая рамка, а внутреннее поле остаётся прежним. Никаких других значений для изменения размеров не просматривается. Что нужно сделать, чтоб менялось и рамка и поле? спасибо..
ОтветитьУдалитьЛариса Нужно поиграться со значениями padding:0 20px;По часовой стрелке(верх,право, низ , слева. Тут об этом http://htmlbook.ru/css/padding
ОтветитьУдалитьСпасибо, Виктория!!
УдалитьНе за что Лариса.
Удалить