< Bootsrap 4

Képek

Szerző: Sallai András

Copyright © Sallai András, 2020

Licenc: CC Attribution-Share Alike 4.0 International

Web: https://szit.hu

Úsztatás

.float-left

.float-right

<img src="kep.png" class="float-left" alt="kép középen">

Lekerekített sarok

.rounded

<img class="rounded w-50 float-left m-2" src="oroszlan.jpg" alt="Oroszlán">

Középreigazítás

<img src="kep.png" class="rounded mx-auto d-block" alt="kép középen">

Másként:

<div class="text-center"> <img src="kep.png" class="rounded" alt="kép középen"> </div>

Indexkép

.img-thumbnail

Nyújtás

.img-fluid

<img src="kep.png" class="img-fluid" alt="nyújtható kép">
<img class="img-fluid w-50 float-left" src="kep.png" alt="nyújtható kép">

Ovális

.rounded-circle

Forrás

A kép forrása: https://hu.wikipedia.org/wiki/Oroszl%C3%A1n

Függelék

Nyújtás forrása

<!DOCTYPE html> <html lang="hu"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>BS</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> </head> <body> <div class="container-fluid"> <h1>Almafa</h1> <img class="img-fluid w-50 float-left mr-2" src="oroszlan.jpg" alt="Oroszlán"> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed doeiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enimad minim veniam, quis nostrud exercitation ullamco laboris nisi utaliquip ex ea commodo consequat. Duis aute irure dolor inreprehenderit in voluptate velit esse cillum dolore eu fugiat nullapariatur. Excepteur sint occaecat cupidatat non proident, sunt inculpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed doeiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enimad minim veniam, quis nostrud exercitation ullamco laboris nisi utaliquip ex ea commodo consequat. Duis aute irure dolor inreprehenderit in voluptate velit esse cillum dolore eu fugiat nullapariatur. Excepteur sint occaecat cupidatat non proident, sunt inculpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed doeiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enimad minim veniam, quis nostrud exercitation ullamco laboris nisi utaliquip ex ea commodo consequat. Duis aute irure dolor inreprehenderit in voluptate velit esse cillum dolore eu fugiat nullapariatur. Excepteur sint occaecat cupidatat non proident, sunt inculpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed doeiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enimad minim veniam, quis nostrud exercitation ull </p> </div> </div> </body> </html>