[SCRIPT] Definir imagem como background de uma <div>
Fala aí, manos.
Conforme pedido do Cláudio/RJ, preparei esse script.
Link da postagem do Cláudio/RJ: http://phpbrasil.com/phorum/read.php?1,194126,194126#msg-194126
Zipei todo o projeto e fiz upload aqui.
PS: Não tem nada a ver com programação em PHP!
index.php
css/estilos_gerais.css
imagens/imagem-topo-pagina.jpg
<ARQUIVO DE IMAGEM>
Conforme pedido do Cláudio/RJ, preparei esse script.
Link da postagem do Cláudio/RJ: http://phpbrasil.com/phorum/read.php?1,194126,194126#msg-194126
Zipei todo o projeto e fiz upload aqui.
PS: Não tem nada a ver com programação em PHP!
index.php
<!DOCTYPE html> <html> <head> <meta content="text/html"; charset="utf-8" http-equiv="content-type"> <meta content="Site Hotel LOREM IPSUM" name="description"> <title>Hotel LOREM IPSUM</title> <link rel="stylesheet" href="css/estilos_gerais.css" type="text/css"> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script src="http://code.jquery.com/jquery-3.2.1.min.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script> <script> $(function() {$( "#calendario" ) .datepicker({changeMonth: true, ChangeYear: true, showOtherMonths: true, selectOthersMonths: true, dateFormat: 'dd/mm/yy', dayNames:['Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta', 'Sexta', 'Sábado'], dayNamesMin: ['D', 'S', 'T', 'Q', 'Q', 'S', 'S', 'D'], dayNamesShort: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sáb'], monthNames: ['Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto','Setembro', 'Outubro', 'Novembro', 'Dezembro'], monthNamesShort: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez']});}); </script> </head> <body class="corpo-documento"> <div class="topo-pagina"> Conteúdo da div: topo-pagina </div> <div class="base-pagina"> Conteúdo da div: base-pagina </div> <div class="pagina"> Conteúdo da div: pagina </div> <div class="main"> Conteúdo da div: main </div> <div class="header"> Conteúdo da div: header </div> <div class="header-topo"> Conteúdo da div: header-topo </div> </body> </html>
css/estilos_gerais.css
.topo-pagina { background-image: url('../imagens/imagem-topo-pagina.jpg'); background-repeat: no-repeat; background-position: center top; width: 100%; height: 250px; /* ADICIONEI ESSA LINHA, POIS A DIV NÃO TEM CONTEÚDO, LOGO, NÃO IRIA APARECER NO NAVEGADOR */ float: left; } .base-pagina { background-image: url('../imagens/imagem-topo-pagina.jpg'); background-repeat: repeat-x; background-position: left bottom; width: 100%; height: 250px; /* ADICIONEI ESSA LINHA, POIS A DIV NÃO TEM CONTEÚDO, LOGO, NÃO IRIA APARECER NO NAVEGADOR */ float: left; }
imagens/imagem-topo-pagina.jpg
<ARQUIVO DE IMAGEM>
Data | Autor | Changelog | Download |
---|---|---|---|
19/04/2017 8:42am | Felipe M. @LipESprY | - | Versão 1 |
Novo Comentário: