Как я могу повернуть свой фон и вырезать часть, которая будет выделяться из ширины устройства? - PullRequest
1 голос
/ 07 марта 2020

Так что в основном я хочу иметь повернутый фон на мобильном телефоне. Я пытался использовать

transform: rotate(15deg);

Но всякий раз, когда я это делаю, ширина тела становится больше, и я пытался использовать такие вещи, как

overflow: hidden;

, но это не сработало. Поэтому я хотел знать, как я могу вращать свой фон / цвет фона.

Rotated Background with different sections

1 Ответ

0 голосов
/ 07 марта 2020

Если вы используете это CSS, он автоматически настроит фон для зрителя, чтобы соответствовать его экрану (отзывчиво)

<style>
body {
  background-image: url("example.jpg"); /* The image used */
  background-color: #cccccc; /* Used if the image is unavailable */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */      
  background-attachment: fixed; /* makes the background position fixed */
}
</style>
<html>
<body>
<!-- put your html here !-->
</body>
</html>

Я полагаю, это лучше, чем поворот фона, но если вы действительно хотите я думаю, что для поворота фона можно использовать что-то вроде этого.

<style>
body {
  background-image: url("example.jpg"); /* The image used */
  background-color: #cccccc; /* Used if the image is unavailable */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */      
  background-attachment: fixed; /* makes the background position fixed */
  transform: rotate(15deg);
}
</style>
<html>
<body>
<!-- put your html here !-->
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...