Уроки HTML, CSS / Как наложить текст на картинку
Рет қаралды 33,553
Привет друзья! Сегодня мы сможем с вами смотреть, как добавить текст на картинку в HTML, это бывает полезно, когда вы хотите подписать картинку прямо поверх нее - чтобы это стильно смотрелась, например. Конечно, есть много вариантов, как это сделать, можно разместить картинку в контейнере, а текст в отдельном контейнере или можно было бы поместить картинку на задний фон контейнера, а текст просто в контейнере и его выравнивать так как нам нужно, либо использовать другие варианты, и мы сейчас с вами разберем один из вариантов.
Дополнительное описание, домашние задания и многое другое можно найти на сайте WISEPLAT: wiseplat.org/
1) Урок на сайте Wiseplat:
✔ Сообщество программистов: wiseplat.org/
✔ -------------
Вступай в группу Вк - wiseplat 🚀
Группа FaceBook - / wiseplat
Инстаграм Wiseplat: / wiseplat
Instagram: / shpaginoleg
Twitter - / wiseplatschool
********************************
Если Вам понравилась публикация, подписывайтесь на канал!
Ставьте лайки, тогда будем еще писать такой контент :)
Если есть вопросы или пожелания, то пишите, в комментариях.
********************************
- Уроки от #OlegShpagin 👨🏼💻
- Все уроки по хештегу #htmlshpagin #cssshpagin
@humoyunruhiddinov4832 Жыл бұрын
чел харооош
@user-oj9bw8mv1u 3 жыл бұрын
сильно помог, спасибо!
@karinaS Жыл бұрын
Спасибо огромное .Легкое и простое объяснение. Обязательно подписка!!!
@MaRoL_view 4 жыл бұрын
Спасибо, помог!
@wiseplat 4 жыл бұрын
Привет! Делись с друзьями каналом 😀👍
@denismaltcev3356 4 жыл бұрын
Отдельное спасибо за ctr + alt + b в плагине )
@3t3rn4l 2 жыл бұрын
ну приплыли, спасибо большое за инфу про брэкетс, буду юзать
@_brightgirl_6065 4 жыл бұрын
спасибо!!!
@lumeaceaiuluisrl6343 3 жыл бұрын
Спасибо!
@MadSplit 3 жыл бұрын
Cпасибо!
@BoT_34m1 5 ай бұрын
ляяяяяяяяяя спппасибо, очень помог
@Alex-2908 Жыл бұрын
автор почему-то не сказал (может не знает?), что что position: absolute; спозиционирует текст относительно body, а не относительно картинки. то есть если над этой картинкой появится какой-то другой элемент - текст уплывет, так как он не привязан к этой картинке (то, что он внутри контейнера - не удержит его на его месте). нужно на вмещающий контейнер повесить position: relative (или в 2019 было по-другому?))
@Paleolog_Alex Жыл бұрын
Здравствуйте, подскажите пожалуйста: на моем сайте после подписки пользователь должен по задумке в рассылке получать удостоверение пользователя, а для этого мне нужно на определенный шаблон (картинку) наложить некие поля с кодом куда бы подтягивались данные об этом пользователе фамилия и т д. Каким образом изготовить такие поля на бланке удостоверения, в каком формате должна быть такая картинка? И какой код должен быть вписан в такие поля ? Хотя бы дайте направление где об этом получить информацию?
@iljabogdanovs1593 3 жыл бұрын
Привет, а в html без использования CSS это можно делать?
@davidsuraganlive 3 жыл бұрын
спасибо помогли
@user-ei8xi9pp3r Жыл бұрын
Большие пасибулики.
@metavers_player 2 жыл бұрын
спасибо помог
@nikeltw 2 жыл бұрын
Спасибо вы мне не помогли информация устарела position больше нет!
@user-hg6cd2gz6v Жыл бұрын
Как сделать адаптируемую картинку и внутри текст тоже адаптируемый и при этом сохраняющий позицию в картинке
@soup8094 3 жыл бұрын
А как сделать,чтобы можно было вот так в ряд выставить текст на картинке? Я хочу сделать переходы по страницам.
@sisofodh 2 жыл бұрын
Гений
@valvetigu5207 2 жыл бұрын
Ситуация. У меня кратинка, поверх которой текст. Но есть еще выпадающее меню, которое выпадая прячется за картинкой/ текстом. Как исправить?
@user-pl3ot8vo8u 3 жыл бұрын
А если к примеру картинка будет увеличиваться или становиться меньше, то абсолютное позиционирование не будет вылезать?
@rozelia_777 Жыл бұрын
Будет. К сожалению, у меня все вылезает :(
@glimmer5103 3 жыл бұрын
Здравствуйте. Сделайте видео как сайт сделать на нескольких языках.
@wiseplat 3 жыл бұрын
Привет! Можно сделать так kzfaq.info/get/bejne/fLJhdNF3xK7IeZs.html А можно сделать отдельную структуру для этого и перевод брать из базы и отображать его в зависимости от языка пользователя.
@alexanderpadalka5708 3 жыл бұрын
✔
@dmitruz1900 2 жыл бұрын
можно как то в css сделать текст справа от картинки?
@d.dorant2406 4 ай бұрын
через флексбокс
@perstj5746 2 жыл бұрын
У меня не получается контрл Алт б почему
@Aisponch Жыл бұрын
в итоге нижние блоки будут упирается в текст а не в картинку
@BoT_34m1 5 ай бұрын
@jackpeterson541 4 жыл бұрын
а разве текст позиционировать абсолютно нормально ?
@chelepunka 3 жыл бұрын
А не проще в фотошопе сделать такую картинку,какую вам надо и вставить её потом в коде?
@wiseplat 3 жыл бұрын
Привет:) Конечно проще, но нужно было именно так - для SEO - чтобы текст со страницы считывал робот. Что учишь сейчас?
@chelepunka 3 жыл бұрын
@@wiseplat понятно) учу сейчас питон параллельно с С++,как бы странно это не звучало)
@wiseplat 3 жыл бұрын
@@chelepunka Так правильно, посмотри на чем написан Python :) Напиши ответ сюда :)
@chelepunka 3 жыл бұрын
@@wiseplat на С
@raf_18 3 жыл бұрын
А эта комбинация работает в Visual Studio?
@bobojongiyoev8797 Жыл бұрын
Прикин чо нашол возможно фотошоп и воля Если ето будет ссылка то другое дело
@_Fantom_. 2 жыл бұрын
Вообще-то правильнее было бы выровнять текст с помощью top и left..
@youtude.8950 2 жыл бұрын
Не проще надпись в фотошопе наложить.
Фрілансер по життю
Рет қаралды 369 М.
Изучаем мир ИТ / Олег Шпагин / Программирование
Рет қаралды 28 М.
МИЛАНА ТУТ 👀
Рет қаралды 2,2 МЛН
ВебКадеми | Юрий Ключевский
Рет қаралды 12 М.
Изучаем мир ИТ / Олег Шпагин / Программирование
Рет қаралды 17 М.
DKA-DEVELOP
Рет қаралды 2,8 МЛН
Изучаем мир ИТ / Олег Шпагин / Программирование
Рет қаралды 17 М.
Фрілансер по життю
Рет қаралды 672 М.
Code Lab - Уроки по программированию
Рет қаралды 4,6 М.