Вопросы Теги

Поместите текст поверх изображения в HTML, не помещая изображение в качестве фона.

Найти похожие ответы здесь: http://sickprogrammersarea.blogspot.in/2014/03/technical-interview-questions-on-c_6.html

Нарезка означает, что данные, добавленные подклассом, отбрасываются, когда объект подкласса передается или возвращается по значению или из функции, ожидающей объект базового класса.

Объяснение: Рассмотрим следующее объявление класса: 

           class baseclass
          {
                 ...
                 baseclass & operator =(const baseclass&);
                 baseclass(const baseclass&);
          }
          void function( )
          {
                baseclass obj1=m;
                obj1=m;
          }

Поскольку функции копирования в базовом классе ничего не знают о производной, только копируется только базовая часть производного. Это обычно называют срезанием.

0
задан Ayman Tarig 24 March 2019 в 14:59
поделиться

2 ответа

Вы можете использовать абсолютное позиционирование для текста. По сути, что-то вроде этого: 

<div class="wrapper">
  <img src="../../1021.png" alt class="img img-fluid">
  <div class="text">Here is your text</div>
</div>

И CSS: 

.wrapper {
  position: relative;
  width: 100%;
}

.wrapper img {
  position: relative;
  z-index: 0;
}

.wrapper .text {
  position: absolute;
  z-index: 10;
  bottom: 0;
}

Подстройтесь под свои нужды Принцип заключается в том, что ваш текст & amp; оба элемента изображения содержатся в оболочке, которая должна иметь относительное положение, чтобы вы могли затем изменить текст с абсолютным позиционированием относительно оболочки. Также обратите внимание на z-индексирование, чтобы текст находился сверху изображения.

0
ответ дан Marc Randall 24 March 2019 в 14:59
поделиться

Я просто создаю базовый текстовый перекрывающийся код. Я надеюсь, что это поможет вам. Благодарю 

.parent-class {
	position: relative;
}

.content-class {
	background-color: #fff;
	position: absolute;
	top: 20px;
	left: 20px;
	padding: 10px;
}

.content-class h1,
.content-class p {
  margin: 0;
}
<div class="parent-class">
	<div class="content-class">
		<h1>Hello World!</h1>
		<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
	</div>
	<img src="https://images.pexels.com/photos/1020315/pexels-photo-1020315.jpeg" alt class="img img-fluid">
</div>

0
ответ дан Hassan Siddiqui 24 March 2019 в 14:59
поделиться