#javascript #html #css
#javascript #HTML #css
Вопрос:
У меня есть класс cbImage
, и для всех изображений CSS исправлен
.cbImage img {
width: 100%;
height: 100%;
}
Теперь моя проблема в том, что я не хочу, чтобы все изображения имели одинаковую ширину и высоту.
Как я могу изменить ширину и высоту разных изображений по желанию?
Одно изображение одной панели:
<div class="cbImage w3">
<div class="panel">
<div class="form">
<div class="login">Recent badges</div>
<span class="fa-stack fa-5x has-badge" data-count="6">
<div class="badgesize">
<img src="images/7.png" width=100, height=100 alt="">
</div>
</span>
</div>
Другое изображение:
<div class="cbImage active signin agileits">
<form >
<figure class="snip1336">
<img src="images44.jpg" alt="sample87" />
<figcaption>
<img src="imagesownpic.jpg" alt="profile-sample4" class="profile" />
Как вы можете видеть, у обоих классов есть имя cbImage
.
Таким образом, размер становится фиксированным.
Я хочу, чтобы изображения обоих классов имели разный размер.
Также есть много других CSS, я не могу просто изменить имя и установить ширину и высоту.
Пожалуйста, помогите.
Ответ №1:
вы можете сделать это таким образом.
<img class="example_class">
<img class="example_class" style="width:60px;height:60px;">
Как вы можете видеть, если у вас есть style, он будет прослушивать style, а не class.
Ответ №2:
попробуйте использовать это.
// parent div
<div>
<img class="example_image" src="image_path">
<img class="example_image" src="image_path" style="width:yourimagewidth; height:yourimageheight;">
</div>
вы должны использовать встроенный css, чтобы отличить свое изображение от изображения. Сначала он примет значение вашего встроенного свойства CSS, а затем перейдет к внешнему CSS