Вопросы Теги

расположение фонового изображения CSS (отрицательное положение?)

Я думаю, что хорошо использовать операторы goto, если вы используете их нормальным способом (и здравым языком программирования). Они часто могут сделать ваш код намного проще для чтения и не заставляют вас использовать какую-то извращенную логику только для того, чтобы сделать одну простую вещь.

6
задан Bradley A. Tetreault 5 October 2012 в 17:25
поделиться

2 ответа

Фоновое изображение находится внутри блока, поэтому переместить его наружу невозможно. Что вы можете сделать, так это расположить свое изображение за пределами коробки и переместить его в него.

Вы можете попробовать что-то вроде этого, это не надежно, но может помочь вам в этом. 

<html>
<head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <title>Untitled Document</title>
        <style type="text/css">
                body {
                        background-color:#26140C;
                }

                .box {
                        width: 800px;
                        margin: 0 auto;
                        margin-top: 40px;
                        padding: 10px;
                        border: 3px solid #A5927C;

                        background-color: #3D2216;
                }

                .image {
                    float: left;
                    position: relative;
                    top: -30px;
                }
        </style>
</head>
<body>
        <div class="box">
            <img src='icon_neutral.png' class="image" />
                <h1>This is a test!</h1>
        </div>
</body>
8
ответ дан 8 December 2019 в 04:09
поделиться 
#box {
  position:relative;
}
#shield {
  width:41px;
  height:41px;
  position:absolute;
  top:-25px;
  left:25px;
}

<div id="box">

  <div id="shield">
    <img src="shield.png" />
  </div>

  <h1>Site Title</h1>

</div>
1
ответ дан 8 December 2019 в 04:09
поделиться