Web Мастерская Блог
Сообщество Web Мастеров. Тут собрано всё, чтобы написать свой первый сайт, запустить его в Интернет и поддерживать его в течении всей его работы.
Как убрать полосу прокрутки из <iframe>
Кратко о том, как убрать полосу прокрутки (Scrollbar) из <iframe>.
Допустим, у нас есть такой ифрейм:
Внутри которого можно прокрутить страницу/файл по вертикали, и возможно по горизонтали. Чтобы убрать Scrollbar, добавляем атрибут
Готово. Scrollbar больше нет....
Допустим, у нас есть такой ифрейм:
<iframe src="https://danfa.net/blog/3296/"></iframe>
Внутри которого можно прокрутить страницу/файл по вертикали, и возможно по горизонтали. Чтобы убрать Scrollbar, добавляем атрибут
scrolling
, со значением no
. Вот так:
<iframe src="https://danfa.net/blog/3296/" scrolling="no"></iframe>
Готово. Scrollbar больше нет....
- Жалоба
Стиль маркировочного списка
Чтобы составить список, используют тег
В этом случае, браузер отобразит списки стандартного вида:
Чтобы изменить марке, установите тегу
Вместо значения
Если необходимо изменить цвет маркера, используйте свойство:
Вместо зеленного цвета (
Можно использовать свою картинку, как маркер. И для этого существует свойство:
Где
<li>
внутри <ul>
или <ol>
:
<ul>
<li>1 элемент списка.</li>
<li>2 элемент списка.</li>
<li>3 элемент списка.</li>
</ul>
<ol>
<li>элемент списка.</li>
<li>элемент списка.</li>
<li>элемент списка.</li>
</ol>
В этом случае, браузер отобразит списки стандартного вида:
- 1 элемент списка.
- 2 элемент списка.
- 3 элемент списка.
- элемент списка.
- элемент списка.
- элемент списка.
Чтобы изменить марке, установите тегу
<ul>
CSS свойство list-style-type
:
ul {
list-style-type: disc;
}
Вместо значения
disc
можно использовать circle
, в таком случае, маркеры будут в виде кругляшков, а не жирных точек.Если необходимо изменить цвет маркера, используйте свойство:
li::marker {
color: #008800;
}
Вместо зеленного цвета (
#008800
) можете написать любой другой.Можно использовать свою картинку, как маркер. И для этого существует свойство:
li {
list-style-image: url('marker.png');
}
Где
marker.png
- это Ваша картинка....Как избавиться от всплывающей подсказке при наборе текста в поле (input type="text")
Чтобы запретить появление всплывающей подсказки с возможными вариантами текста, используйте атрибут
Пример:
...
autocomplete
, со значением: off
.Пример:
<input type="text" name:"title" autocomplete="off">
Ограничение на количество символов в текстовом поле (input type="text")
Чтобы ограничить поле на количество вводных символов существует атрибут
В данном случае, в поле нельзя записать более
Следует учесть тот факт, что пользователь может изменить данное значение, используя инструменты браузера, поэтому необходимо проверять количество символов в полученной от пользователя строке, на стороне сервера....
maxlength
, который не позволит написать символов больше, чем указано в его значении:
<input type="text" name:"title" maxlength="25">
В данном случае, в поле нельзя записать более
25
символов.Следует учесть тот факт, что пользователь может изменить данное значение, используя инструменты браузера, поэтому необходимо проверять количество символов в полученной от пользователя строке, на стороне сервера....
Продвинутые CSS-селекторы
Чтобы задать стиль элементу, мы используем атрибут class и id, например, у нас есть два блока, один с классом
Зная этот класс и идентификатор, мы можем стилизовать оба блока, как нам вздумается:
Но что делать, если нам не известны названия класса и идентификатор? Возможно потому, что часть значения атрибута генерируется динамически. На помощь могут придти, так сказать продвинутые CSS-селекторы. Привожу пример динамически созданного идентификатора:
...
class_block
, второй с идентификатором id_block
:
<div class="class_block">
<!-- Содержимое блока -->
</div>
<div id="id_block">
<!-- Содержимое блока -->
</div>
Зная этот класс и идентификатор, мы можем стилизовать оба блока, как нам вздумается:
.class_block {
/* Свойства блока с классом class_block */
}
#id_block {
/* Свойства блока с идентификатором id_block */
}
Но что делать, если нам не известны названия класса и идентификатор? Возможно потому, что часть значения атрибута генерируется динамически. На помощь могут придти, так сказать продвинутые CSS-селекторы. Привожу пример динамически созданного идентификатора:
123_block
- _block
- постоянная часть названия идентификатора, цифры: 123
сгенерированы скриптом, в другом блоке эти цифру уже будут другие, одинаковых чисел в пределах одного документа не должно быть:
<div id="123_block">
<!--
- Apache 6
- CMS 3
- CSS 12
- FTP 1
- HTML 10
- JavaScript 32
- MySQL 16
- Nginx 7
- PHP 41
- phpMyAdmin 2
- SVG 3
- URL 1
- XML 3
- Безопасность 4
- Библиотека JS 12
- Графика 1
- Доменное имя 1
- Инструкция 1
- Кодировка 2
- Контент 6
- Мнение 2
- Монетизация сайта 2
- Настройка 3
- Оптимизация 2
- Ошибка 7
- Поисковая система 1
- Продвижение сайта 6
- Софт 1
- Старт 2
- Функция 1
- Хостинг | Сервер 3