Ihypress Programming ⛭ CSS ❯ Background-Size Property

IHYPRESS PROGRAMMING

CSS examples with code and output for beginners

c programming

HOME | ASP | C | CSS | GNUPLOT | HTML | JAVASCRIPT | PERL | PHP | PYTHON | RUBY | SVG

 CSS ❯ Background-Size Property<04>

<!DOCTYPE html>
<html lang="en"><head>
<meta charset="utf-8">
<title>Background-Size Property</title>
</head>

<body style="font-size:1.2em; font-family:sans-serif;">
<p style="width:600px; height:150px; background:url(https://ihypress.de/textures/rainbow.jpg);">
Original background
</p>

<p style="width:600px; height:150px; background:url(https://ihypress.de/textures/rainbow.jpg); background-size:90px 90px;">
Background resized to 90px/90px
</p>

<p style="width:600px; height:150px; background:url(https://ihypress.de/textures/rainbow.jpg); background-size:50% 50%;">
Background resized to 50%/50%
</p>

<p style="width:600px; height:150px; background:url(https://ihypress.de/textures/rainbow.jpg); background-size:10% 80%;">
Background resized to 10%/80%
</p>
</body></html>

Background-Size Property
Original background

Background resized to 90px/90px

Background resized to 50%/50%

Background resized to 10%/80%

COPYRIGHT © 2015-2024 IHY PRESS Frankfurt am Main 60329 Deutschland