Html & CSS

Programming, development, testing

→

Html & CSS

Html & CSS

HTML elements

HTML tag <a> link to go to another page

HTML tag <abbr> shows an abbreviated name, if you let the mouse down there will be a pop-up inscription

HTML tags fieldset and legend. This is a frame with a title

HTML tag  comment

style="border" in the HTML

HTML поиск элемента, элементов

document.querySelector(...) это JavaScript метод для поиска элемента из document (то есть во всем HTML)

yourElement.querySelectorAll(...) это JavaScript метод для поиска элементов внутри другого HTML элемента

HTML svg (vector graphics for drawing lines, rectangles, ellipses, ...)

HTML canvas (drawing pictures, text, shapes)

HTML <canvas> drawing a rectangle

HTML <canvas> рисуем линии по нажатию мышкой на Canvas

HTML <canvas> we draw pictures

HTML <canvas> we draw a picture with a rotation

HTML <canvas> draw a picture with horizontal reflection

HTML <canvas> we draw a picture and text

HTML <canvas> draw a picture many times in a rectangle (template)

HTML <canvas> how to get mouse coordinates ? Determine the position of the mouse.

HTML <canvas> drawing a snake with lines moveTo, lineTo

CSS

CSS description

After modifying the file css , the browser displays old styles over and over again. Why?

Books to study CSS

CSS flex (элемент может растягиваться или сжиматься и таким образом заполнять свободное пространство)

Что такое CSS flex

Freeze

Шапка в таблице всегда видна при скролинге | freeze header in table | HTML

Div всегда виден при скролинге (position:fixed, position:sticky) | freeze div | HTML

Do Popup using HTML and Javascript

How to make a Popup window in a HTML page | Javascript, HTML, CSS

Motion and animation of pictures

Анимация человечка на месте. Используем HTML элемент <div>. Для анимации используем CSS стили: "animation", "background-image", "background-position", "keyframes"

Анимация человечка в движении (sprite). Используем HTML элементы <div>, <img>. Для анимации используем CSS стили: "animation", "background-image", "background-position", "keyframes"

Рисуем картинку с движением. Используем HTML элемент <canvas>. Для движения используем JavaScript: var img = new Image(), img.src = url, drawImage, timer, window.setInterval

Drawing a picture with movement and animation (sprite). Используем HTML элемент <canvas>. Для движения используем JavaScript: var img = new Image(), img.src = url, drawImage, timer, window.setInterval

Web страница на телефоне

Открываю web страницу на телефоне в Google Chrome. Почему при двойном нажатии размер страницы увеличивается?

Верстка, дизайн страницы

What the Front-end development?

Как определить устройство (планшет, компьютер, телефон) сейчас используется в JavaScript, HTML

Как сделать чтобы ваш сайт работал на телефоне, планшете, компьютере используем css media и max-device-width и min-device-width | HTML | CSS

How to make your website fit in size on your phone, tablet? (HTML meta with attribute name='viewport')

Correct layout HTML. Bad to use table. You need to use div

Что такое Adaptive design (адаптивный дизайн)? Что такое Responsive design (отзывчивый дизайн) ?

Меняем цвет scrollbar (полосы прокрутки) для HTML страницы. Используем CSS

WWW sites for learning

Sites to explore HTML

Ваши Отзывы ... комментарии ...

Экскурсии по Москве: пешеходные, автобусные и речные прогулки на любой вкус

Объявления