Помощь HTML - [10] :: Web-программирование :: Компьютерный форум Ru.Board

Новости • Файловые архивы
Поиск • Активные темы • Топ лист
Правила • Кто в on-line?

Вход • Забыли пароль? • Первый раз на этом сайте? • Регистрация

Компьютерный форум Ru.Board » Интернет » Web-программирование » Помощь HTML

Модерирует : Cheery
Версия для печати • Подписаться • Добавить в закладки
Страницы: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

IIOPTAJI

Newbie

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Ребят, я новичок в хтмл, и на этом форуме тоже, песочницу найти не мог.
Я создаю простой блокнот, пишу там всякие коды, которые нашел в интернете, и возник вопрос, как сделать фон чтобы не белый фон был, а какая нибудь картинка. Если что-то не то задал из вопросов, прошу прощения

Всего записей: 4 | Зарегистр. 05-07-2011 | Отправлено: 21:09 09-08-2013

Mavrikii Platinum Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Disquette вопрос был для темы Вопросы по CSS ячейки td в вашем случае не нуждаются в class="..."
	Всего записей: 15114 \| Зарегистр. 20-09-2014 \| Отправлено: 02:43 20-10-2019 \| Исправлено: Mavrikii, 02:45 20-10-2019

Disquette Junior Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Mavrikii, спасибо; я запутался, пока копипастил и коверкал коды.
	Всего записей: 51 \| Зарегистр. 28-10-2018 \| Отправлено: 07:03 20-10-2019

Alexey87

Advanced Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Уважаемые форумчане, подскажите, пожалуйста, как в коде сделать следующее:
1. Табы выстроить друг под другом, а контент расположить справа от них вплотную.
2. Табы с контентом должны сменяться по времени.
В итоге должно быть как на рисунке.

Всего записей: 657 | Зарегистр. 27-01-2008 | Отправлено: 23:39 08-01-2020

Mavrikii Platinum Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Alexey87 на чистом css вряд ли.. https://codepen.io/bairish/pen/MMJWgq хотя, наверно, возможно. вот так https://onaircode.com/howto-html-css-vertical-tabs-menu/
	Всего записей: 15114 \| Зарегистр. 20-09-2014 \| Отправлено: 00:11 09-01-2020 \| Исправлено: Mavrikii, 00:13 09-01-2020

dneprcomp

Silver Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Alexey87
Я бы использовал flex для первого пункта (HTML + CSS):
A Complete Guide to Flexbox
The Ultimate Animated CSS Flex Cheatsheet
Ultimate Flexbox Cheat Sheet
flex CSS property
A friendly tutorial for modern CSS layouts

Второй пункт с помощью javascript

Всего записей: 3920 | Зарегистр. 31-03-2002 | Отправлено: 04:23 09-01-2020 | Исправлено: dneprcomp, 04:31 09-01-2020

Alexey87 Advanced Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Mavrikii, не могу понять что, но что-то не получается... Посмотрите, пожалуйста, код.
	Всего записей: 657 \| Зарегистр. 27-01-2008 \| Отправлено: 20:22 09-01-2020

Mavrikii Platinum Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Alexey87 к примеру - https://jsfiddle.net/dqa1Lsze/
	Всего записей: 15114 \| Зарегистр. 20-09-2014 \| Отправлено: 21:10 09-01-2020

Alexey87 Advanced Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Mavrikii, благодарю за пример. А как бы теперь реализовать второй пункт моего запроса?
	Всего записей: 657 \| Зарегистр. 27-01-2008 \| Отправлено: 18:39 10-01-2020

Mavrikii Platinum Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Alexey87 не проверял в старых браузерах https://jsfiddle.net/75perxfu/
	Всего записей: 15114 \| Зарегистр. 20-09-2014 \| Отправлено: 19:32 10-01-2020

Alexey87 Advanced Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Mavrikii, а куда лучше расположить код javascript? Внутри body или head? Или еще куда? Пробовал данные варианты - в Internet Explorer 11.0.9600.18920 не работает.
	Всего записей: 657 \| Зарегистр. 27-01-2008 \| Отправлено: 21:15 21-01-2020

Mavrikii

Platinum Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Alexey87

Цитата:

Внутри body или head?

лучше в конце страницы.

Цитата:

в Internet Explorer 11.0.9600.18920 не работает.

в нем все еще нет forEach, поэтому добавить

Код:

if ( !Array.prototype.forEach ) {
Array.prototype.forEach = function(fn, scope) {
for(var i = 0, len = this.length; i < len; ++i) {
fn.call(scope, this[i], i, this);
}
}
}

Всего записей: 15114 | Зарегистр. 20-09-2014 | Отправлено: 21:18 21-01-2020

Alexey87 Advanced Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Mavrikii, благодарю за помощь! Код работает!
	Всего записей: 657 \| Зарегистр. 27-01-2008 \| Отправлено: 22:16 22-01-2020

WONDROUS

Silver Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Mavrikii
Продолжая про видео на мобильных из темы CSS. Почитал по ссылке, но у меня даже на планшете с Mobile Safari 7.1 не работает видео, не воспроизводится. Картинка статичная есть и всё.

Всего записей: 3347 | Зарегистр. 30-06-2002 | Отправлено: 00:29 09-02-2020 | Исправлено: WONDROUS, 00:30 09-02-2020

Mavrikii Platinum Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору WONDROUS у меня в планшете еще на андроид 5 все ок, сафари у меня нет
	Всего записей: 15114 \| Зарегистр. 20-09-2014 \| Отправлено: 02:20 09-02-2020

WONDROUS Silver Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Mavrikii Понятно, спасибо за ответ! Тогда получается, что всё зависит от версии браузера.
	Всего записей: 3347 \| Зарегистр. 30-06-2002 \| Отправлено: 02:56 09-02-2020

Alexey87

Advanced Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Mavrikii, подскажите, пожалуйста, как в табах Вашего кода расположить несколько отцентрированных элементов:

ФОТО ФОТО ФОТО
подпись подпись подпись

(лейблы уже не нужны ... ~~<label></label>~~)

Всего записей: 657 | Зарегистр. 27-01-2008 | Отправлено: 12:46 01-03-2020

Mavrikii

Platinum Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Alexey87

Цитата:

расположить несколько отцентрированных элементов

width: calc(100% / 3);
https://jsfiddle.net/kr6qmhvx/

Всего записей: 15114 | Зарегистр. 20-09-2014 | Отправлено: 21:37 01-03-2020

Alexey87

Advanced Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Mavrikii, спасибо!
А каким образом задать центрирование не только отдельного элемента (ФОТО + подпись), но и их совокупность (т.е. центрирование в блоке).
И еще - при наведении курсора на любой из элементов блока tab1 в строке состояния браузера отображается ссылка на элемент из блока tab2 (ФОТО или ПОДПИСЬ). И при клике открывается соответственно не то, что нужно.
Как это исправить?

Всего записей: 657 | Зарегистр. 27-01-2008 | Отправлено: 00:29 02-03-2020 | Исправлено: Alexey87, 20:32 09-03-2020

Mavrikii

Platinum Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Alexey87
не нужно мне писать в ПМ, тем более с подтверждением - такие сообщения удаляются не читая.

Цитата:

но и их совокупность (т.е. центрирование в блоке).

делаете каждому display: inline-block и применяете к контейнеру центрирование содержимого.

Цитата:

И еще - при наведении курсора на любой из элементов блока tab1 в строке состояния браузера отображается ссылка на элемент из блока tab2 (ФОТО или ПОДПИСЬ).

не видя кода - что я могу сказать?

Всего записей: 15114 | Зарегистр. 20-09-2014 | Отправлено: 21:05 09-03-2020

Alexey87

Advanced Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:

делаете каждому display: inline-block

чему? col? так для них задан display: inline-block

Цитата:

применяете к контейнеру центрирование содержимого

какому контейнеру? content? если да, то каким образом? text-align: center?

Всего записей: 657 | Зарегистр. 27-01-2008 | Отправлено: 22:14 09-03-2020

Страницы: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

Компьютерный форум Ru.Board » Интернет » Web-программирование » Помощь HTML

Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC