Окошко для вставки кода или текста (без прокрутки)
с использованием тэга input
size="10" -
size="40" -
Атрибут size - определяет ширину текстового поля
- код окошка без прокрутки
Окошко для вставки кода или текста (с прокруткой)
с использованием тэга textarea
Атрибуты определяющие площадь окна: cols - определяет ширину текстового поля rows - определяет высоту (кол-во строк) текстового поля
- код окошка с прокруткой
При желании, окошко можно залить цветом, т.е. сделать фон.
Атрибуты встречающиеся в ниже приведенных кодах: background-color:цвет фона border: 2px solid #CC0000; бордюр, где:
2px - толщина бордюра, solid – вид линии, #CC0000 – цвет бордюра.
код или текст, который будет отображаться в окошке
код или текст, который будет отображаться в окошке
или изменить цвет бордюра(обводки) окошка:
border-right: yellow 2px solid; - параметры правого бордюра border-top: red 2px solid; - параметры верхнего бордюра border-left: lime 2px solid; - параметры левого бордюра border-bottom: blue 2px solid; - параметры нижнего бордюра color:white; - цвет текста width: 30%; - ширина окошка
КОДЫ
КОДЫ
Важное дополнение.
Все коды окошек, которые приведены выше,- позволяют пользователю не только брать код из окошка, но и писать самому в этом окошке. В этом нет ничего страшного.
Но если вдруг, пользователь нечаянно чего-нибудь сотрет или видоизменит код, а потом скопирует его себе, то код может и не сработать…
Чтобы этого избежать, тегу добавляется атрибут readonly (от англ. "read only" ‒ «только для чтения»). readonly="readonly" - указывает, что текстовый элемент формы имеющий данный атрибут не может изменяться пользователем, в том числе вводиться новый текст или модифицироваться существующий.(копировать можно!)
И вот результат:
Изменить текст в этом окошке пользователю уже не удастся
Изменить текст в этом окошке пользователю уже не удастся
Изменить текст в этом окошке пользователю уже не удастся
font-size:20px; - задает размер шрифта и окошка:
Ваш Текст
- font-size: 10px
Ваш Текст
- font-size: 15px
Ваш Текст
- font-size: 20px
Ваш Текст
- код здесь text-align: center; - расположение текста в окошке
Здесь будет ваш текст, располагающийся по центу
Здесь будет ваш текст располагающийся по центу
- код здесь Важное пояснение:
Такие окошки подходят для написания кодов или текста в один абзац.
При разделении текста на разные абзацы будет выскакивать и виден значок , обозначающий конец абзаца и например текст:
«Проблемы множатся в геометрической прогрессии,
На сердце увеличивая груз,
Но не впадаю я от этого в депрессию,
В прострации, поскольку, нахожусь.»
будет выглядеть в окошке вот так:
Проблемы множатся в геометрической прогрессии,
На сердце увеличивая груз,
Но не впадаю я от этого в депрессию,
В прострации, поскольку, нахожусь.
Для того, чтобы код можно было писать прямо в тексте, без окошка, его надо обрамить так:
Ваш короткий код
Отображается моноширным шрифтом Courier New в ОДНУ строку.
Поэтому в этот тег лучше заключать короткий код или другие теги, так как длинный код уйдет за пределы правого края страницы.
Текст в ФЛЕЙМЕ с прокруткой
Если Вы хотите добавить в свой пост много текста, но так чтобы пост не занимал много места и его не нужно было убирать под КАТ, а читать его прокручивая:
Фразочки из интернета:
Чем больше знаешь, тем больше знаешь лишнего.
Умно отвечают только тому, кто умно спрашивает.
Ума будет больше, если его не расходовать.
Не ищите отговорок, они должны быть под руками.
Думает ли тот, кто говорит что думает?
Ваша борьба за показатели может кончиться борьбой врачей за вашу жизнь.
Коллектив единомышленников: каждый думает о себе.
Не обижайся на шутку - возьми шутника на заметку.
Чем хуже жизнь, тем прекраснее мечты.
Чтобы казаться умным, прикиньтесь дураком.
Чем ленивее человек, тем больше его труд похож на подвиг.
Мысли покидают голову, не выдерживая одиночества.
Всякое решение старых проблем порождает новые.
Книгу мы любим потому, что она самый молчаливый друг.
Прозаик пишет обдуманное, лирик - пережитое, программист - прочитанное.
Если у тебя есть совесть, то и сто способов не помогут тебе разбогатеть.
Как бы ты ни был скромен, людям все равно хочется, чтобы ты был еще скромнее.
Чтобы любить людей, нужно иметь большое больное сердце.
Будь самоучкой, не жди, пока жизнь научит.
Предпоследняя ошибка выявляется при демонстрации работы начальнику.
Скромность украшает человека, но плохо одевает.
Нужно бороться со старыми предрассудками, чтобы победили новые.
Подчиненные тоже люди и тоже не хотят думать.
Многое можно заставить человека сделать по собственному желанию.
Сделай словам тесно и мыслям не поздоровится.
Если ничто другое не помогает, прочтите, наконец, инструкцию!
Не тратьте силы, возьмите молоток побольше.
Шутки надо понимать быстро, хотя не обязательно правильно.
Ваш текст
текст с прокруткой в флейме с переменным: overflow-y: scroll; - прокрутка по высоте видна всегда height: 100px; - высота блока видимого текста border:1px solid black; - бордюр: тонкая, сплошная, черная линия
текст с прокруткой в флейме с переменным: overflow-y: scroll; - прокрутка по высоте видна всегда
height: 100px; - высота блока видимого текста
border:1px solid black; - бордюр: тонкая, сплошная, черная линия
текст с прокруткой в флейме с переменным: overflow: scroll; ; - прокрутка по высоте и ширине блока видна всегда height: 130px; - высота блока видимого текста width: 800px; - ширина блока видимого текста border:1px solid black; - бордюр: тонкая, сплошная, черная линия text-indent: 5pt; - устанавливает величину отступа первой строки блока текста scrollbar-arrow-color: #660000; - цвет треугольника на верхнем и нижнем квадратах text-align: left – выравнивание текста слева font face="georgia" – вид шрифта текста font size="3" – размер шрифта текста font color="#000000" – цвет шрифта текста
текст с прокруткой в флейме с переменным: overflow: scroll; - прокрутка по высоте и ширине блока видна всегда
height: 130px; - высота блока видимого текста
width: 800px; - ширина блока видимого текста
border:1px solid black; - бордюр: тонкая, сплошная, черная линия
text-indent: 5pt; - устанавливает величину отступа первой строки блока текста
scrollbar-arrow-color: #660000; - цвет треугольника на верхнем и нижнем квадратах
text-align: left – выравнивание текста слева
font face="georgia" – вид шрифта текста
font size="3" – размер шрифта текста
font color="#000000" – цвет шрифта текста
текст с прокруткой в флейме с переменным: overflow: scroll; - прокрутка по высоте и ширине блока видна всегда style="width: 800px;" - ширина строки написанного текста width: 800px; - ширина блока видимого текста
height: 130px; - высота блока видимого текста
border:1px solid black; - бордюр: тонкая, сплошная, черная линия
text-indent: 5pt; - устанавливает величину отступа первой строки блока текста
scrollbar-arrow-color: #660000; - цвет треугольника на верхнем и нижнем квадратах
text-align: left – выравнивание текста слева
font face="georgia" – вид шрифта текста
font size="3" – размер шрифта текста
font color="#000000" – цвет шрифта текста
текст с прокруткой в флейме с переменным: overflow: scroll; - прокрутка по высоте и ширине блока видна всегда
style="width: 800px;" - ширина строки написанного текста
height: 130px; - высота блока видимого текста
width: 500px; - ширина блока видимого текста
border:1px solid black; - бордюр: тонкая, сплошная, черная линия
text-indent: 5pt; - устанавливает величину отступа первой строки блока текста
scrollbar-arrow-color: #660000; - цвет треугольника на верхнем и нижнем квадратах
text-align: left – выравнивание текста слева
font face="georgia" – вид шрифта текста
font size="3" – размер шрифта текста
font color="#000000" – цвет шрифта текста
текст с прокруткой в флейме с переменным:
теми же, кроме overflow: auto; - полосы прокрутки отображаются при переполнении блока видимости
текст с прокруткой в флейме с переменным:
height: 130px; - высота блока видимого текста
width: 500px; - ширина блока видимого текста
style="width: 795px;" - ширина строки написанного текста
border:1px solid black; - бордюр: тонкая, сплошная, черная линия overflow: auto; - полоса прокрутки отображается при переполнении блока видимости
text-indent: 5pt; - устанавливает величину отступа первой строки блока текста
scrollbar-arrow-color: #660000; - цвет треугольника на верхнем и нижнем квадратах
text-align: left – выравнивание текста слева
font face="georgia" – вид шрифта текста
font size="3" – размер шрифта текста
font color="#000000" – цвет шрифта текста
Запрет переноса строки.
Тег NOBR запрещает перенос строки.
В результате текст, заключенный в этот тег, будет размещаться в одной строке независимо от ее размера.
Это приводит к появлению полосы горизонтальной прокрутки.
Закрывающийся тег обязателен.
В результате текст будет размещаться в одной строке независимо от ее размера. Закрывающийся тег обязателен.
текст
текст с прокруткой в флейме с разными стилями (шрифтами) написания текста
ВАШ ТЕКСТ ВАША ПОДПИСЬ
Атрибуты встречающиеся в кодах:
width: 100%; - ширина блока видимого текста, задается в % или px height: 300px; - высота блока видимого текста margin-top: 0px; - отступ сверху от начала сообщения margin-left: 0px; - отступ с левой стороны text-indent: 5pt; - устанавливает величину отступа первой строки блока текста (например, для абзаца < p >). Воздействия на все остальные строки не оказывается. border:1px solid black; - обводка (бордюр) заданного блока в котором будет виден текст, если поставить 0px бордюра не видно. overflow - управляет тем, как ведёт себя содержимое блочного элемента, если его размер превышает допустимую (заданную) длину/ширину. overflow-x - управляет поведением блока при переполнении по ширине overflow-y - управляет поведением блока при переполнении по высоте overflow: auto - полоса прокрутки отображается (становится видимой) при переполнении блока видимости overflow:scroll - полоса прокрутки видна всегда, даже если переполнения нет style="width: 800px;" - ширина строки написания текста внутри блока text-align: left – выравнивание текста: слева - left, справа – right, по центу – center, justify font size="3" – размер шрифта текста font color="#000000" – цвет шрифта текста font face="georgia" – вид шрифта текста
Переменные прокрутки: scrollbar-face-color - это цвет передней стороны панели прокрутки scrollbar-shadow-color - это цвет нижней и правой граней панели прокрутки. scrollbar-highlight-color - это цвет верхней и левой граней панели прокрутки scrollbar-3dlight-color - это цвет отсвета. scrollbar-track-color - это цвет полосы, по которой "ходит" панель прокрутки. scrollbar-arrow-color - это цвет треугольника на верхнем и нижнем квадратах. #FFFFFF - это коды цвета, которые можно менять.