Как отрегулировать высоту изображения bg и метки?

Question

Как отрегулировать высоту изображения bg и метки? Вот результат, который мне нужен, и вот site, что мне нужно настроить навигацию. Я пытаюсь использовать высоту: [no.of px], но выход этого не то, что мне нужно.

И когда я пытаюсь увеличить изображение метки, изображение будет переполняться к изображению bg.

Answer 1

Я думаю, что вам нужно имущество background-size, применимое к соответствующим элементам.

См ссылка: http://www.w3.org/TR/css3-background/#the-background-size

Кроме того, вы можете написать правило CSS более consisely используя сокращенную нотацию, то есть, background свойство.

Возможно, вам также понадобится подать заявку background-clip.

div { 
 
    border: 1px dotted blue; 
 
    height: 150px; 
 
    width: 450px; 
 
    background-image: url(http://placekitten.com/1000/500); 
 
    background-repeat: no-repeat; 
 
    background-size: 100px 50px; 
 
    background-position: 50px 50px; 
 
}

<div>Sample text. Original image is 1000x500 px, but displayed as 100x50px.</div>