1

Подскажите пожалуйста, как закрасить div на половину красным цветом?

<div style="width:200px; height:200px; border:1px solid;background:red;">
</div>

2 ответа 2

5

linear-gradient

div {
  width: 200px;
  height: 200px;
  border: 1px solid;
  background: linear-gradient(to right, red 50%, transparent 50%);
}
<div></div>

pseudo-elements

div {
  width: 200px;
  height: 200px;
  border: 1px solid;
  position: relative;
}

div::before {
  content: "";
  position: absolute;
  width: 50%;
  height: 100%;
  z-index: -1;
  background: red;
}
<div></div>

3

box-shadow

div {
  width: 200px;
  height: 200px;
  border:1px solid #000;
  box-shadow: inset 100px 0 #f00;
}
<div></div>

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.