Новости Joomla

NorrCompetition 3.0 — новые возможности компонента конкурсов и голосований для Joomla 6

Релиз NorrCompetition 3.0 — крупное обновление расширения для проведения конкурсов и голосований в Joomla.

Вышли релизы безопасности Joomla 6.1.1 и Joomla 5.4.6

Релиз безопасности Joomla 6.1.1 и Joomla 5.4.6

Проект Joomla! рад сообщить о выходе Joomla 6.1.1 и Joomla 5.4.6. Это релизы безопасности и исправления ошибок для серий 5.x и 6.x.

👩‍💻 JoomShopping: Самый полный курс по созданию интернет-магазина на CMS Joomla.

👩‍💻 JoomShopping: Самый полный курс по созданию интернет-магазина на CMS Joomla.

В открытый доступ выложен видео-курс Дмитрия Гончарова по созданию интернет-магазина на связке Joomla + JoomShopping. Видеоуроки содержат пошаговые инструкции от регистрации хостинга до особенностей вёрстки, настройки способов оплаты и доставки.

В видео фигурирует JoomShopping 4 и Joomla 3, однако JoomShopping довольно консервативный компонент и многие способы и подходы в нём не менялись годами, поэтому данные видео могут быть по прежнему полезны.

Смотреть видео-курс

@joomlafeed

1   Вниз
0 Пользователей и 1 Гость просматривают эту тему.
  • 11 Ответов
  • 2682 Просмотров
*

PNP

  • Осваиваюсь на форуме
  • 11
  • 0 / 0
Как разместить картинку за текстом в статье?
« : 10.08.2021, 17:22:05 »
Друзья, помогите решить вопрос.
Как разместить полноразмерную картинку фоном за текстом?
Сейчас это выглядит так
http://natalyaloginova.ru
кусочек картинки  в начале статьи.

Код фона и часть текста.
<div style="background-image: url('images/nature-3849873_1920.jpg'); background-position: center; background-repeat: no-repeat;"> </div>
<p style="text-align: center;"><span style="font-size: 18pt; color: #000000; font-family: verdana, geneva, sans-serif;">Индивидуальный онлайн-курс<br /></span></p>
<p style="text-align: center;"><span style="font-size: 12pt; color: #000000; font-family: verdana, geneva, sans-serif;"><strong><span style="font-size: 24pt;">ПАНИЧЕСКИЕ АТАКИ, ТРЕВОЖНОСТЬ</span><br /></strong></span></p>
Записан
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
Re: Как разместить картинку за текстом в статье?
« Ответ #1 : 10.08.2021, 17:27:58 »
проще через CSS
Код
.item-105 .com-content-article__body{}
Записан
*

PNP

  • Осваиваюсь на форуме
  • 11
  • 0 / 0
Re: Как разместить картинку за текстом в статье?
« Ответ #2 : 10.08.2021, 19:23:44 »
Цитата: effrit от 10.08.2021, 17:27:58
проще через CSS
Код
.item-105 .com-content-article__body{}

Спасибо. Добавила ваш код в template.css шаблона. Ситуация не изменилась.
Я новенькая в этой теме. В инете пересмотрела разные варианты, не работают. Или я что-то не то делаю.
Записан
*

ShopES

  • Захожу иногда
  • 426
  • 11 / 0
Re: Как разместить картинку за текстом в статье?
« Ответ #3 : 10.08.2021, 19:27:31 »
так а в боди бэкграунд с картинкой то вставили?
Записан
*

draff

  • Гуру
  • 5801
  • 434 / 7
  • ищу работу
Re: Как разместить картинку за текстом в статье?
« Ответ #4 : 10.08.2021, 19:30:26 »
Код
<div style="background-image: url('images/nature-3849873_1920.jpg'); background-position: center; background-repeat: no-repeat;"> 
<p style="text-align: center;"><span style="font-size: 18pt; color: #000000; font-family: verdana, geneva, sans-serif;">Индивидуальный онлайн-курс<br /></span></p>
<p style="text-align: center;"><span style="font-size: 12pt; color: #000000; font-family: verdana, geneva, sans-serif;"><strong><span style="font-size: 24pt;">ПАНИЧЕСКИЕ АТАКИ, ТРЕВОЖНОСТЬ</span><br /></strong></span></p>
</div>
Разместите текст в блоке с фоном, или текст выводите вне потока, т.е. position:absolute
Записан
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
Re: Как разместить картинку за текстом в статье?
« Ответ #5 : 10.08.2021, 19:44:54 »
ну полная версия вот так выглядит
а неполная, конечно, покажет ровно ничего  ;D
Код
.item-105 .com-content-article__body{background-image: url('images/nature-3849873_1920.jpg'); background-position: center; background-repeat: no-repeat;}
Записан
*

PNP

  • Осваиваюсь на форуме
  • 11
  • 0 / 0
Re: Как разместить картинку за текстом в статье?
« Ответ #6 : 10.08.2021, 20:01:05 »
Потерпите меня немного@charset "UTF-8";
*,:after,:before {
 -webkit-box-sizing:border-box;
 box-sizing:border-box
}
HTML {
 font-family:sans-serif;
 line-height:1.15;
 -webkit-text-size-adjust:100%;
 -webkit-tap-highlight-color:rgba(0, 0, 0, 0)
}
article,aside,figcaption,figure,footer,header,hgroup,main,nav,section {
 display:block
}
body {
 margin:0;
 font-family:Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
 font-size:1rem;
 font-weight:400;
 line-height:1.7143;
 color:#333;
 text-align:left;
 background-color:#fff
}
.item-105 .com-content-article__body {
background-image: url('images/nature-3849873_1920.jpg');
background-position: center; background-repeat: no-repeat;
}
[tabindex="-1"]:focus {
 outline:0!important
}

Все равно не выводит. Опять что-то не то сделала...
Записан
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
Re: Как разместить картинку за текстом в статье?
« Ответ #7 : 10.08.2021, 20:16:14 »
вот на это поменяйте
Код
background: url('/images/nature-3849873_1920.jpg') top center no-repeat;
Записан
*

PNP

  • Осваиваюсь на форуме
  • 11
  • 0 / 0
Re: Как разместить картинку за текстом в статье?
« Ответ #8 : 10.08.2021, 20:25:52 »
Цитата: effrit от 10.08.2021, 20:16:14
background: url('/images/nature-3849873_1920.jpg') top center no-repeat;
Все получилось! Спасибо))))))))) :D :D :D
Записан
*

PNP

  • Осваиваюсь на форуме
  • 11
  • 0 / 0
Re: Как разместить картинку за текстом в статье?
« Ответ #9 : 10.08.2021, 20:28:03 »
А можно в догонку еще один вопрос. Между меню и статье белое поле. Не смогла его уменьшить.  Когда смотрю через "Исследовать элемент№, этого поля нет.
Записан
*

Olg

  • Завсегдатай
  • 1183
  • 91 / 2
Re: Как разместить картинку за текстом в статье?
« Ответ #10 : 10.08.2021, 20:32:44 »
Код
.t4-main-body {
    padding-top: 8.58rem;
    padding-bottom: 8.58rem;
}
замените на
Код
.t4-main-body {
    padding-top: 0;
    padding-bottom: 8.58rem;
}
или поставьте вместо нуля нужную вам величину.
Записан
*

PNP

  • Осваиваюсь на форуме
  • 11
  • 0 / 0
Re: Как разместить картинку за текстом в статье?
« Ответ #11 : 10.08.2021, 20:59:27 »
Записан
1   Вверх
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Можно ли прописать в scss ссылку и установить картинку?

Автор vova630

 Ответов: 0
Просмотров: 1330 		Последний ответ 02.01.2021, 13:56:09
от vova630
Div с картинкой и текстом как ссылка

Автор suic

 Ответов: 5
Просмотров: 2751 		Последний ответ 11.04.2020, 12:47:15
от suic
Не могу вывести картинку нужно размера

Автор stonehand

 Ответов: 3
Просмотров: 1786 		Последний ответ 22.03.2019, 21:55:29
от sivers
Картинку уменьшить при сжимание

Автор GuN

 Ответов: 1
Просмотров: 1465 		Последний ответ 10.08.2017, 11:57:15
от SheriffDM
Адаптировать картинку с анмацией

Автор GuN

 Ответов: 1
Просмотров: 1285 		Последний ответ 10.08.2017, 11:50:23
от SheriffDM