Подгонка изображения в ячейке

Question

Как мне разместить изображение в ячейке? Я хочу разместить все изображение в желтой части

Ниже приведен мой код.

<!--Top Part-->
<div style="width: 100%; display: table;">
<div style="display: table-row">
<div style="width: 770px; height:270px; display: table-cell; background-color:#B2BABB;">
<p style="font-family: Allerta Stencil; font-size:40px; color:red; padding-top: 65; 
padding-left:120;">SCOPE<br>Industries Berhad<br>
<span style="font-size:25px; color:black; font-family: Allan;">
A simple solution,<br></span>
<span style="font-size:25px; color:black; font-family: Allan; padding-left: 135;">
for a complex problem.</span></p>
</div>

<!-- Slideshow -->  
<div style="display: table-cell; background-color:#F7DC6F ">
<img src="123.jpg" style="width:200;">
</div>
<!-- Slideshow End -->

Answer 1

Если вы зафиксировали ширину элемента вашей оболочки (root), попробуйте использовать width:100% для внутреннего элемента, например, для тега изображения, чтобы я мог настроить его в соответствии с шириной вашего устройства.

<img src="123.jpg" style="width:100%;">

Answer 2

При установке ширины в CSS необходимо указать единицу измерения. Поэтому вместо width: 200 вам нужно использовать width: 200px. px обозначает пиксель.

В качестве альтернативы, вы можете попробовать установить ширину изображения на 100%.

Answer 3

Вы можете установить это изображение как фон div, и использовать «background-size: cover;»