Преобразование пикселей в проценты с помощью CSS

Question

У меня есть прямоугольник , ширина 125px и высота 48px. Я пытаюсь увеличить прямоугольник на 5% . Как я могу увеличить прямоугольник на 5% , зная ширину и высоту в пикселях.

css html pixel

2

Jacob V. 28 Май 2016 в 00:34

Answer 1

Функция CSS calc - ваш друг:

.rect {
    width: calc(125px * 105%);
    height: calc(48px * 105%);
}

2

Mordred 27 Май 2016 в 21:39

Answer 2

Другим вариантом может быть использование Преобразование - Масштаб

5% будет 1,05

div {
  line-height:48px;
  background:yellow;
  border:thin dotted black;
  text-align:center;
  width:125px;
  height:48px;
}
.five {
  transform:scale(1.05);
}

<div>125px</div>
<div class="five">5% +</div>

1

DaniP 27 Май 2016 в 21:46

Answer 3

#rectangle {
  height: 48px;
  width: 125px;
  background: red;
}

#bigger-rectangle {
  height: calc(48px * 1.05);
  width: calc(125px * 1.05);
  background: green;
}

<div id="rectangle"></div>
<div id="bigger-rectangle"></div>

0

user 27 Май 2016 в 21:40

Answer 4

125 * 1,05 и 48 * 1,05 в вашем калькуляторе?

0

Johannes 27 Май 2016 в 21:55

Преобразование пикселей в проценты с помощью CSS

4 ответа

Похожие вопросы

Новые вопросы

css