Troca de fundo em página HTML

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Em curso Troca de fundo em página HTML

Mensagem por Scripter em 09/06/18, 11:18 pm

Detalhes da questão


Endereço do fórum: http://policia-bph.forumeiros.com
Versão do fórum: ModernBB

Descrição


Galera eu vi esse post https://ajuda.forumeiros.com/t109668-personalizar-pagina-inicial?highlight=mudar+p%E1gina+inicial  e queria saber como faço pra trocar a imagem de fundo sem perder o código
avatar

Scripter
Nível 2

Masculino
Inscrito dia : 01/06/2018
Mensagens : 6
Pontos Ativos : 10

Ver perfil do usuário http://policia-bph.forumeiros.com/

Em curso Re: Troca de fundo em página HTML

Mensagem por Pedxz em 10/06/18, 08:11 am

Olá @Scripter,
Adicione no início no seu CSS

Código:
html, body {
    background: #fff url(https://i.imgur.com/t3982AP.jpg) no-repeat center 50% fixed!important;
}

Atenciosamente,
avatar

Pedxz
Usuário destaque

Masculino
Inscrito dia : 13/01/2017
Mensagens : 739
Pontos Ativos : 1055

Ver perfil do usuário https://ajuda.forumeiros.com

Em curso Re: Troca de fundo em página HTML

Mensagem por Scripter em 10/06/18, 09:43 am

@Pedxz escreveu:Olá @Scripter,
Adicione no início no seu CSS

Código:
html, body {
    background: #fff url(https://i.imgur.com/t3982AP.jpg) no-repeat center 50% fixed!important;
}

Atenciosamente,

O código daquele post é feito em HTML eu queria só troca o fundo da imagem feito naquele post
avatar

Scripter
Nível 2

Masculino
Inscrito dia : 01/06/2018
Mensagens : 6
Pontos Ativos : 10

Ver perfil do usuário http://policia-bph.forumeiros.com/

Em curso Re: Troca de fundo em página HTML

Mensagem por Pedxz em 10/06/18, 09:52 am

Desculpe não tinha percebido,
Código:
<html>
<head>
  <!-- Site made with Mobirise Website Builder v4.1.4, https://mobirise.com -->
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="generator" content="Mobirise v4.1.4, mobirise.com">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="shortcut icon" href="" type="image/x-icon">
  <meta name="description" content="">
  <title>Bem Vindo ao Fórum</title>
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Rubik:300,300i,400,400i,500,500i,700,700i,900,900i">
  <link rel="stylesheet" href="https://arquivosdiversos.github.io/nhdgames/assets/web/assets/mobirise-icons/mobirise-icons.css">
  <link rel="stylesheet" href="https://arquivosdiversos.github.io/nhdgames/assets/tether/tether.min.css">
  <link rel="stylesheet" href="https://arquivosdiversos.github.io/nhdgames/assets/bootstrap/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://arquivosdiversos.github.io/nhdgames/assets/socicon/css/styles.css">
  <link rel="stylesheet" href="https://arquivosdiversos.github.io/nhdgames/assets/theme/css/style.css">
  <link href="https://fonts.googleapis.com/css?family=Droid+Sans:400,700" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Roboto+Slab:100,300,400,700" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Rubik:300,300i,400,400i,500,500i,700,700i,900,900i" rel="stylesheet">
  <link href="https://arquivosdiversos.github.io/nhdgames/assets/fonts/style.css" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Droid+Sans:400,700" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Roboto+Slab:100,300,400,700" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Rubik:300,300i,400,400i,500,500i,700,700i,900,900i" rel="stylesheet">
  <link href="https://arquivosdiversos.github.io/nhdgames/assets/fonts/style.css" rel="stylesheet">
  <link rel="stylesheet" href="https://arquivosdiversos.github.io/nhdgames/assets/mobirise/css/mbr-additional.css" type="text/css">
 
 
 
</head>
<body>
  <style>
    .bg-cust {
    background-image: url(https://i.imgur.com/3roSNcA.jpg);
    }
  </style>
<section class="bg-cust mbr-fullscreen mbr-parallax-background" id="header2-2" data-rv-view="91">
 
 
 
    <div class="mbr-overlay" style="opacity: 0.7; background-color: rgb(0, 0, 0);"></div>
 
    <div class="container align-center">
        <div class="media-container-column mbr-white col-md-10 offset-md-1">
            <h1 class="mbr-section-title mbr-bold pb-3 mbr-fonts-style display-1">
                BEM VINDO AO FÓRUM</h1>
         
         
            <div class="mbr-section-btn"><a class="btn btn-md btn-primary-outline display-4" href="/register"><span class="mbri-edit mbr-iconfont mbr-iconfont-btn"></span>CRIAR CONTA</a>
                <a class="btn btn-md btn-primary-outline display-4" href="/forum"><span class="mbri-home mbr-iconfont mbr-iconfont-btn"></span>ENTRAR NO FÓRUM</a> <a class="btn btn-md btn-primary-outline display-4" href="https://discordapp.com/invite/fVVnFJ8" target="_blank"><span class="socicon socicon-discord mbr-iconfont mbr-iconfont-btn"></span>DISCORD</a></div>
        </div>
    </div>
    <div class="mbr-arrow hidden-sm-down" aria-hidden="true">
        <a href="#next">
            <i class="mbri-down mbr-iconfont"></i>
        </a>
    </div>
</section>
 
<section class="engine"><a href="https://mobirise.co/f">bootstrap builder</a></section><section class="features16 cid-qrzmV6KjG9" id="features16-6" data-rv-view="94">
 
 
 
    <div class="container align-center">
        <h2 class="pb-3 mbr-fonts-style mbr-section-title display-2">
            EQUIPE DO FÓRUM</h2>
        <h3 class="pb-5 mbr-section-subtitle mbr-fonts-style mbr-light display-5"></h3>
        <div class="row media-row">
         
        <div class="team-item col-lg-3 col-md-6">
                <div class="item-image">
                    <img src="https://arquivosdiversos.github.io/nhdgames/assets/images/franklin-clinton-225x225.jpg" alt="" title="" media-simple="true">
                </div>
                <div class="item-caption py-3">
                    <div class="item-name px-2">
                        <p class="mbr-fonts-style display-5">
                          Isaque
                        </p>
                    </div>
                 
                 
                </div>
            </div><div class="team-item col-lg-3 col-md-6">
                <div class="item-image">
                    <img src="https://arquivosdiversos.github.io/nhdgames/assets/images/franklin-clinton-225x225.jpg" alt="" title="" media-simple="true">
                </div>
                <div class="item-caption py-3">
                    <div class="item-name px-2">
                        <p class="mbr-fonts-style display-5">
                          Lancelot
                        </p>
                    </div>
                 
                 
                </div>
            </div><div class="team-item col-lg-3 col-md-6">
                <div class="item-image">
                    <img src="https://arquivosdiversos.github.io/nhdgames/assets/images/franklin-clinton-225x225.jpg" alt="" title="" media-simple="true">
                </div>
                <div class="item-caption py-3">
                    <div class="item-name px-2">
                        <p class="mbr-fonts-style display-5">
                          Speed
                        </p>
                    </div>
                 
                 
                </div>
            </div></div> 
    </div>
</section>
 
<section once="" class="cid-qrznhOISmE" id="footer6-7" data-rv-view="104">
 
 
 
 
 
    <div class="container">
        <div class="media-container-row align-center mbr-white">
            <div class="col-12">
                <p class="mbr-text mb-0 mbr-fonts-style display-7">
                    ©️ Criado por <a href="http://ajuda.forumeiros.com/u47631" target="_blank" class="text-white">Harleen</a>&nbsp;| Hospedado em&nbsp;<a href="https://www.forumeiros.com" target="_blank" class="text-white">Forumeiros</a></p>
            </div>
        </div>
    </div>
</section>
 
 
  <script src="https://arquivosdiversos.github.io/nhdgames/assets/web/assets/jquery/jquery.min.js"></script>
  <script src="https://arquivosdiversos.github.io/nhdgames/assets/tether/tether.min.js"></script>
  <script src="https://arquivosdiversos.github.io/nhdgames/assets/bootstrap/js/bootstrap.min.js"></script>
  <script src="https://arquivosdiversos.github.io/nhdgames/assets/smooth-scroll/smooth-scroll.js"></script>
  <script src="https://arquivosdiversos.github.io/nhdgames/assets/jarallax/jarallax.min.js"></script>
  <script src="https://arquivosdiversos.github.io/nhdgames/assets/theme/js/script.js"></script>
 
 
</body>
</html>

localize https://i.imgur.com/3roSNcA.jpg e mude para a imagem que você quer usar
avatar

Pedxz
Usuário destaque

Masculino
Inscrito dia : 13/01/2017
Mensagens : 739
Pontos Ativos : 1055

Ver perfil do usuário https://ajuda.forumeiros.com

Em curso html pages

Mensagem por quiclee1 em 14/06/18, 11:31 am

If you have any problem of html5 web page, you find more html5 templates.
https://quiclee.com/2018/free-html5-website-templates/
avatar

quiclee1
Novo membro

Masculino
Inscrito dia : 14/06/2018
Mensagens : 1
Pontos Ativos : 1

Ver perfil do usuário https://ajuda.forumeiros.com/

Em curso Re: Troca de fundo em página HTML

Mensagem por Scripter em 15/06/18, 09:31 pm

@quiclee1 escreveu:If you have any problem of html5 web page, you find more html5 templates.
https://quiclee.com/2018/free-html5-website-templates/

How i use this templates?
avatar

Scripter
Nível 2

Masculino
Inscrito dia : 01/06/2018
Mensagens : 6
Pontos Ativos : 10

Ver perfil do usuário http://policia-bph.forumeiros.com/

Em curso Re: Troca de fundo em página HTML

Mensagem por Harleen em 16/06/18, 11:25 pm

Olá Scripter, eu criei esses benditas páginas com boa vontade, mas como tem malandro compartilhando por aí sem os devidos créditos, modifiquei algumas coisas Demônio
Veja nesse tópico (clique aqui), como alterar cada imagem e ícone.
Caso queira adicionar mais coisas, terá de baixar o programa (Mobirise), criar a página e hospedar por conta própria.

Lembrando, caso remova o meu nome dos créditos, a página não irá funcionar.

Para alterar o fundo, modifique essa imagem, no início do código, pela imagem que deseja.
http://cdn.pcwallart.com/images/tomb-raider-wallpaper-1920x1080-wallpaper-1.jpg

Código:
<style type="text/css">
    h1 {
        color: #00c9c9 !important;
    }

    .mbr-arrow>a>i {
        top: 12px !important;
    }

    .mbr-fullscreen {
        background-image: url('http://cdn.pcwallart.com/images/tomb-raider-wallpaper-1920x1080-wallpaper-1.jpg');
    }

    [class^="socicon-"]:before, [class*=" socicon-"]:before {
        line-height: 1.3 !important;
    }

    .socicon:before {
        font-size: x-large;
    }
</style>
<html>

<head>
    <!-- Site made with Mobirise Website Builder v4.0.16, https://mobirise.com -->
    <!-- Pagina criada por Harleen Ex-Ajudeira - Fórum dos Fóruns SE REMOVER MEU NOME DOS CRÉDITOS A PÁGINA NÃO IRÁ FUNCIONAR -->
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="generator" content="Mobirise v4.0.16, mobirise.com" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="shortcut icon" href="" type="image/x-icon" />
    <meta name="description" content="" />
    <title>Bem Vindo ao Fórum</title>
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Rubik:300,300i,400,400i,500,500i,700,700i,900,900i" />
    <link href="https://fonts.googleapis.com/css?family=Droid+Sans:400,700" rel="stylesheet" />
    <link href="https://fonts.googleapis.com/css?family=Roboto+Slab:100,300,400,700" rel="stylesheet" />
    <link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet" />
    <link rel="stylesheet" href="https://arquivosdiversos.github.io/mixwin/assets/web/assets/mobirise-icons/mobirise-icons.css" />
    <link rel="stylesheet" href="https://arquivosdiversos.github.io/mixwin/assets/tether/tether.min.css" />
    <link rel="stylesheet" href="https://arquivosdiversos.github.io/mixwin/assets/bootstrap/css/bootstrap.min.css" />
    <link rel="stylesheet" href="https://arquivosdiversos.github.io/mixwin/assets/socicon/css/styles.css" />
    <link rel="stylesheet" href="https://arquivosdiversos.github.io/mixwin/assets/theme/css/style.css" />
    <link rel="stylesheet" href="https://arquivosdiversos.github.io/mixwin/assets/mobirise/css/mbr-additional.css" type="text/css" />



</head>

<body>
    <section class="mbr-fullscreen mbr-parallax-background" id="header2-2" data-rv-view="63">



        <div class="mbr-overlay" style="opacity: 0.7; background-color: rgb(0, 0, 0);"></div>

        <div class="container align-center">
            <div class="media-container-column mbr-white col-md-10 offset-md-1">
                <h1 class="mbr-section-title mbr-bold pb-3 mbr-fonts-style display-1">
                    BEM VINDO AO FÓRUM</h1>


                <div class="mbr-section-btn">
                    <a class="btn btn-outline-info" href="/register"><i class="fa fa-pencil-square-o fa-2x" aria-hidden="true"></i> CRIAR CONTA</a>
                    <a class="btn btn-outline-info" href="/forum"><i class="fa fa-sign-in fa-2x" aria-hidden="true"></i>&nbsp; ENTRAR NO FÓRUM</a>
                    <a class="btn btn-outline-info" href="" target="_blank"><span class="socicon socicon-steam mbr-iconfont mbr-iconfont-btn"></span>BOTÃO SOCIAL</a>
                </div>
            </div>
        </div>
        <div class="mbr-arrow hidden-sm-down" aria-hidden="true">
            <a href="#next">
                        <i class="mbri-down mbr-iconfont"></i>
                    </a>
        </div>
    </section>

    <section class="engine"><a href="https://mobirise.co/m">bootstrap table</a></section>
    <section class="features16 cid-qrzmV6KjG9" id="features16-6" data-rv-view="66">



        <div class="container align-center">
            <h2 class="pb-3 mbr-fonts-style mbr-section-title display-2">
                EQUIPE DO FÓRUM</h2>
            <div class="row media-row">

                <div class="team-item col-lg-3 col-md-6">
                    <div class="item-image">
                        <img src="http://orig05.deviantart.net/f394/f/2012/083/f/3/lara_croft_and_the_guardian_of_light_icon_v1_by_kamizanon-d4tsva7.png" alt="" title="" media-simple="true" />
                    </div>
                    <div class="item-caption py-3">
                        <div class="item-name px-2">
                            <p class="mbr-fonts-style display-5">
                                Membro 1
                            </p>
                        </div>


                    </div>
                </div>
                <div class="team-item col-lg-3 col-md-6">
                    <div class="item-image">
                        <img src="http://orig05.deviantart.net/f394/f/2012/083/f/3/lara_croft_and_the_guardian_of_light_icon_v1_by_kamizanon-d4tsva7.png" alt="" title="" media-simple="true" />
                    </div>
                    <div class="item-caption py-3">
                        <div class="item-name px-2">
                            <p class="mbr-fonts-style display-5">
                                Membro 2
                            </p>
                        </div>


                    </div>
                </div>
                <div class="team-item col-lg-3 col-md-6">
                    <div class="item-image">
                        <img src="http://orig05.deviantart.net/f394/f/2012/083/f/3/lara_croft_and_the_guardian_of_light_icon_v1_by_kamizanon-d4tsva7.png" alt="" title="" media-simple="true" />
                    </div>
                    <div class="item-caption py-3">
                        <div class="item-name px-2">
                            <p class="mbr-fonts-style display-5">
                                Membro 3
                            </p>
                        </div>


                    </div>
                </div>
            </div>
        </div>
    </section>

    <section once="" class="cid-qrznhOISmE" id="footer6-7" data-rv-view="76">





        <div class="container">
            <div class="media-container-row align-center mbr-white">
                <div class="col-12">
                    <p class="mbr-text mb-0 mbr-fonts-style display-7">
                        ©️ Criado por <a href="https://ajuda.forumeiros.com/u47631" target="_blank" class="text-white">Harleen</a>&nbsp;| Hospedado em&nbsp;<a href="https://www.forumeiros.com" target="_blank" class="text-white">Forumeiros</a></p>
                </div>
            </div>
        </div>
    </section>


    <script src="https://arquivosdiversos.github.io/mixwin/assets/web/assets/jquery/jquery.min.js"></script>
    <script src="https://arquivosdiversos.github.io/mixwin/assets/tether/tether.min.js"></script>
    <script src="https://arquivosdiversos.github.io/mixwin/assets/bootstrap/js/bootstrap.min.js"></script>
    <script src="https://arquivosdiversos.github.io/mixwin/assets/smooth-scroll/smooth-scroll.js"></script>
    <script src="https://arquivosdiversos.github.io/mixwin/assets/jarallax/jarallax.min.js"></script>
    <script src="https://arquivosdiversos.github.io/mixwin/assets/theme/js/script.js"></script>


</body>

</html>

Até mais
avatar

Harleen
Membro do Fórum

Feminino
Inscrito dia : 09/07/2012
Mensagens : 1628
Pontos Ativos : 2137

Ver perfil do usuário

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum