Тег <table>
Элемент <table> служит контейнером для элементов, определяющих содержимое таблицы. Любая таблица состоит из строк и ячеек, которые задаются с помощью тегов <tr> и <td>. Внутри <table> допустимо использовать следующие элементы: <caption>, <col>, <colgroup>, <tbody>, <td>, <tfoot>, <th>, <thead> и <tr>.
Синтаксис
Атрибуты
align - Определяет выравнивание таблицы
background - Задает фоновый рисунок в таблице
bgcolor - Цвет фона таблицы
border - Толщина рамки в пикселах
bordercolor - Цвет рамки
cellpadding - Отступ от рамки до содержимого ячейки
cellspacing - Расстояние между ячейками
cols - Число колонок в таблице
frame - Сообщает браузеру, как отображать границы вокруг таблицы
height - Высота таблицы
rules - Сообщает браузеру, где отображать границы между ячейками
summary - Краткое описание таблицы
width - Ширина таблицы
#теги #html
Элемент <table> служит контейнером для элементов, определяющих содержимое таблицы. Любая таблица состоит из строк и ячеек, которые задаются с помощью тегов <tr> и <td>. Внутри <table> допустимо использовать следующие элементы: <caption>, <col>, <colgroup>, <tbody>, <td>, <tfoot>, <th>, <thead> и <tr>.
Синтаксис
<table>
<tr>
<td>Текст</td>
</tr>
</table>Атрибуты
align - Определяет выравнивание таблицы
background - Задает фоновый рисунок в таблице
bgcolor - Цвет фона таблицы
border - Толщина рамки в пикселах
bordercolor - Цвет рамки
cellpadding - Отступ от рамки до содержимого ячейки
cellspacing - Расстояние между ячейками
cols - Число колонок в таблице
frame - Сообщает браузеру, как отображать границы вокруг таблицы
height - Высота таблицы
rules - Сообщает браузеру, где отображать границы между ячейками
summary - Краткое описание таблицы
width - Ширина таблицы
#теги #html
Добавлять под постами хэштеги? Кликая на них, можно переходить к интересующему посту. Это улучшит навигацию по каналу.
Final Results
93%
Да
7%
Нет
Навигация по каналу.
Кликай по хэштегу, чтобы перейти к посту, который опубликован на канале с данным хэштегом.
#javascript
#css
#html
#игры
#теги
#полезныйресурс
#учись
#python
#измираIT
#сниппет
#курсы
#книга
#шпаргалки
#ии
#статья
#начинающему
Кликай по хэштегу, чтобы перейти к посту, который опубликован на канале с данным хэштегом.
#javascript
#css
#html
#игры
#теги
#полезныйресурс
#учись
#python
#измираIT
#сниппет
#курсы
#книга
#шпаргалки
#ии
#статья
#начинающему
CSS Gradient - генератор градиентов
Бесплатный инструмент, который позволяет создавать градиентный фон. Помимо этого, он включает в себя необходимые настройки: тип, количество переходов, их позиции, HEX/RGBA кодировки цветов, угол наклона и прозрачность. Результат отображается ниже в виде CSS стилей градиента. Так же имеется совместимость с IE6+
#css #полезныйресурс
Бесплатный инструмент, который позволяет создавать градиентный фон. Помимо этого, он включает в себя необходимые настройки: тип, количество переходов, их позиции, HEX/RGBA кодировки цветов, угол наклона и прозрачность. Результат отображается ниже в виде CSS стилей градиента. Так же имеется совместимость с IE6+
#css #полезныйресурс
Создаём конвертер длины, в нашем случае из миль в километры.
Сложность - ЛЕГКО
Языки - HTML, JS
ШАГ 1
Добавляем HTML:
ШАГ 2
Добавляем JavaScript:
Если есть вопросы по коду, писать сюда @WebLabFeedBackBot
#javascript #html
Сложность - ЛЕГКО
Языки - HTML, JS
ШАГ 1
Добавляем HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>WebLab - конвертер</title>
</head>
<body>
<h2>Конвертер длины Миль в Километры</h2>
<p>
<label>Миль</label>
<input id="Ml" type="number" placeholder="Миль" oninput="Converter(this.value)" onchange="Converter(this.value)">
</p>
<p>
Километры: <span id="Km"></span>
</p>
</body>
</html>ШАГ 2
Добавляем JavaScript:
<script>
function Converter(Num) {
document.getElementById("Km").innerHTML=Num/0.62137;
}
</script>Если есть вопросы по коду, писать сюда @WebLabFeedBackBot
#javascript #html
Несколько бесплатных онлайн игр для освоения CSS, преимущественно для новичков.
🧩 Flexbox Froggy
🧩 Flexbox Defense
🧩 Grid Garden
🧩 CSS Diner
Если есть вопросы, писать сюда @WebLabFeedBackBot
#css #игры
🧩 Flexbox Froggy
🧩 Flexbox Defense
🧩 Grid Garden
🧩 CSS Diner
Если есть вопросы, писать сюда @WebLabFeedBackBot
#css #игры
Создаём изображение с прозрачным фоновым текстом.
Сложность - ЛЕГКО
Языки - HTML, CSS
ШАГ 1
Добавляем HTML:
ШАГ 2
Добавляем CSS:
#css #html
Сложность - ЛЕГКО
Языки - HTML, CSS
ШАГ 1
Добавляем HTML:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="container">
<img src="WebLab.jpg" alt="Photo" style="width:100%;">
<div class="avatar">
<h1>WebLab</h1>
<p>Подпишись на канал WebLab | Веб-разработка</p>
</div>
</div>
</body>
</html>ШАГ 2
Добавляем CSS:
<style>
* {
box-sizing: border-box;
}
body {
margin: 0;
font-family: Courier New;
font-size: 15px;
}
.container {
position: relative;
max-width: 777px; /* Максимальная ширина */
margin: 0 auto; /* Ставим в центр */
}
.container img {vertical-align: middle;}
.container .avatar {
position: absolute; /* Располагаем фоновый текст */
bottom: 0;
background: rgba(0, 0, 0, 0.5); /* Черный фон с непрозрачностью 0,5 */
color: aqua;
width: 100%;
padding: 20px;
}
</style>#css #html
Web Skills - это набор полезных навыков, которым можно научиться в качестве веб-разработчика. Этот сайт полезен для людей, которые только начали изучать веб-разработку, а также для людей, которые работают в этой области уже много лет и хотят узнать что-то новое.
#полезныйресурс
#полезныйресурс
Embla Carousel - лёгкая библиотека для создания слайдеров-каруселей на JavaScript. Она позволяет создавать отзывчивые и адаптивные, кастомизируемые карусели. Есть большое количество готовых шаблонов.
#css #javascript #html
#css #javascript #html
Реализуем секундомер с использованием JavaScript.
Сложность - СРЕДНЕ
Языки - HTML, JS
🖥 Читать статью 🖥
Если есть вопросы по коду, писать сюда @WebLabFeedBackBot
#javascript #html
Сложность - СРЕДНЕ
Языки - HTML, JS
🖥 Читать статью 🖥
Если есть вопросы по коду, писать сюда @WebLabFeedBackBot
#javascript #html
Baba is You – одна из лучших головоломок 2019 года и хороший инструмент для обучения использованию логики и переменных в программировании. Каждое слово соответствует объекту или действию, определяющему свойства уровней. Слова, обозначающие объекты и свойства, можно перемещать для изменения выполняемых объектами действий. Это игра показывает, как замена переменных может повлиять на код.
#игры
#игры
JavaScript. Как сгенерировать случайное число от 1 до 10?
Anonymous Quiz
32%
Math.floor(Math.random(10)+1);
35%
Math.floor(Math.random() * 10) + 1;
14%
Math.random() * 10+1;
19%
Math.random(10)+1;
Создаём русскую матрицу.
Сложность - ЛЕГКО
Языки - HTML, JS, CSS
🖥 Читать статью 🖥
Если есть вопросы по коду, писать сюда @WebLabFeedBackBot
#html #javascript #css
Сложность - ЛЕГКО
Языки - HTML, JS, CSS
🖥 Читать статью 🖥
Если есть вопросы по коду, писать сюда @WebLabFeedBackBot
#html #javascript #css
Реализуем простое, но необычное боковое меню.
Сложность - ЛЕГКО
Языки - HTML, JS, CSS
🖥 Читать статью 🖥
В этой статье Вы узнаете, как сделать анимированное меню, которое сдвигает содержимое страницы вправо, с добавлением затемнения.
Если есть вопросы по коду, писать сюда @WebLabFeedBackBot
#css #javascript #html
Сложность - ЛЕГКО
Языки - HTML, JS, CSS
🖥 Читать статью 🖥
В этой статье Вы узнаете, как сделать анимированное меню, которое сдвигает содержимое страницы вправо, с добавлением затемнения.
Если есть вопросы по коду, писать сюда @WebLabFeedBackBot
#css #javascript #html
CSS Button Generator - css генератор кнопок для сайтов
Это сайт, на котором Вы сможете просто собрать красивую кнопку для вашего сайта, использую понятный интерфейс.
#полезныйресурс #css
Это сайт, на котором Вы сможете просто собрать красивую кнопку для вашего сайта, использую понятный интерфейс.
#полезныйресурс #css
Html. Укажите тег позволяющий определить нумерованный список.
Anonymous Quiz
27%
<ul>
24%
<list>
5%
<al>
43%
<ol>
Html. Выберите тег, создающий маркированный список.
Anonymous Quiz
17%
<ol>
22%
<list>
23%
<li>
38%
<ul>
Создаем неоновый текст с помощью CSS.
На этом сайте, Вы пошагово научитесь создавать имитацию неоновых вывесок с различными анимированными эффектами.
#css #html #полезныйресурс
На этом сайте, Вы пошагово научитесь создавать имитацию неоновых вывесок с различными анимированными эффектами.
#css #html #полезныйресурс
Fancy Border Radius - инструмент для генерации сложной фигуры.
Перетягивая ползунки можно создать необычную фигуру и в итоге получить значения CSS свойства border-radius.
#полезныйресурс #css
Перетягивая ползунки можно создать необычную фигуру и в итоге получить значения CSS свойства border-radius.
#полезныйресурс #css
Тег <canvas>.
Создает область, в которой при помощи JavaScript можно рисовать разные объекты, выводить изображения, трансформировать их и менять свойства. При помощи тега <canvas> можно создавать рисунки, анимацию, игры и др.
Синтаксис
Атрибуты
height - Задает высоту холста. По умолчанию 300.
width - Задает ширину холста. По умолчанию 150.
Обязателен закрывающий тег.
#html #javascript
Создает область, в которой при помощи JavaScript можно рисовать разные объекты, выводить изображения, трансформировать их и менять свойства. При помощи тега <canvas> можно создавать рисунки, анимацию, игры и др.
Синтаксис
<canvas id="идентификатор"> </canvas>Атрибуты
height - Задает высоту холста. По умолчанию 300.
width - Задает ширину холста. По умолчанию 150.
Обязателен закрывающий тег.
#html #javascript
3D CSS Plane - самолёт, который летит и управляется с помощью библиотеки GSAP. Самолёт может менять направление движения и включать "огни" с наступлением ночи.
Полный код проекта присутствует.
#полезныйресурс #css #javascript #html
Полный код проекта присутствует.
#полезныйресурс #css #javascript #html