"O Pequeno Príncipe"
Bootstrap 4.1.1 Snippet by raquel2020

Post to Facebook Tweet this

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="UTF-8"> <title>Aprendendo DIV</title> <link href="https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap" rel="stylesheet"> </head> <body > <div id="livro"> <div id="autor"> <h2 style="color:lightblue;">Antoine de Saint-Exupéry</h2> </div> <div id="titulo"> <h1 style="color:red;">O pequeno príncipe</h1> </div> <div id="figuras"> <div id="aquarelas"> <h5 style="color:lightblue;">Com aquarelas do autor</h5> <div class="rodape"> <h3 style="color:orange;">global</h3> </div> </div> </div> </div> <!--Abaixo CDN Globo--> <!--https://s3.glbimg.com/cdn/fonts/proximanova/bold.woff2--> </body> </html>
body{ background: lightblue; } h1{ font-size:60px; font-family: 'Dancing Script', cursive; } h3{ font-family:Arial, Helvetica, sans-serif; font-size:30px; } #livro{ margin:0px auto; height:700px; width:550px; background:darkblue radial-gradient(rgb(84, 84, 247), darkblue); } #autor{ padding-top:20px; text-align:center; } #titulo{ text-align:center; height:20px; } #figuras{ height:600px; background-image:url("http://heliane.somee.com/prince.png"); background-repeat:no-repeat; background-position:bottom; } #aquarelas{ text-align:right; width:55%; padding-top:35%; } .rodape{ width:50%; padding-top:90%; text-align:center; }

Related: See More

Vue Now UI Kit PRO

Questions / Comments: