5
respostas

MENU BOOTSTRAP

LANDING PAGE

Eu codei conforme abaixo:

1) LOGO da Empresa primeiro do menu e centralizado 2) Menu bootstrap e reponsive centralizado ( Menu 4 ítens)

Pórem ao clicar no 1 item do menu o Logo e o Menu desaparecem.

Eu gostaria que o LOGO e o Menu ficassem no top, somente na primeira pagina no meio.

Seria landing page.

Alguém poderia me ajudar?

insira seu código aqui

<!DOCTYPE html>

endereço/p>

telefone

e-mail

Titulo.


xxxxxxxxxxxxxxxxxxxxx.

xxxxxxxxxxxxxxxxxxxxxxx.

titulo>

xxxxxxxxxxxxxxxxxxxxxxxxx

xxxxxxxxxxxxxxxx

xxxxxxxxxxxxxxxxxxxxx

xxxxxxxxxxxxxxxx

xxxxxxxxxxxxxxxxxxxxxx


<

titulo!

sub titulo

xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx


sub titulo!

xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx!

css

html{ height: 100%;

} body{

font-family: 'Lato', Helvetica, sans-serif; padding-top: 50px; background-color: white; overflow: hidden; background-color: white; font-size: 19px; margin: 10px; padding: 10px;

}

header { margin-bottom: 15px; }

button { margin: 5px; }

h1 { font-family: 'arial', cursive; color: gray; font-size: 165px; margin-top:90px; text-align: center; margin-right:0; padding-right: 0; margin-bottom: 0;

}

h2 { font-family: Arial, Helvetica, sans-serif; font-size: 47px; text-align: center; margin-top:0; padding-right: 0; color:blue; margin-bottom: 0;

}

logo{

float:center; text-align: center; }

/Ajustes no Menu | Navegação/ .navbar { background: #ffffff; border: none; box-shadow: none; padding: 5px; position:relative; }

.container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header { margin-top:10px; font-size:18px; margin-left:165px; }

/FIM ajustes/

endereco

{ text-align: center; color: gray; font-size:14px; }

.col-md-12 { padding: 5px; margin-left: 550px;

}

section { min-height: 100vh; text-align: center; margin-top:500px; } /INICIO Ajustes H2 | Vison /

.primeiro { font-size: 20px; margin-top: 200px; text-align: center; Color:gray;

}

/ FIM Ajustes H2 | Vison /

/ INICIO Ajustes PARAGRAFO VISION | Vison /

.pa1 {

font-size: 19px; margin-top: 30px; text-align: center; margin-left: -2px; margin-right: 0px; Color:gray;

}

.pa2 {

font-size: 19px; text-align: center; margin-left: -7px; margin-right: 0px; color:gray;

}

/ FIM Ajustes PARAGRAFO VISION | Vison /

/ FIM INICIO PARAGRAFO ABOUT | ABOUT / .segundo{ font-size: 40px; text-align: center; margin-left: -7px; margin-right: 0px; color: gray;

}

.segundo1{

font-size: 30px; text-align: center; margin-left: -7px; margin-right: 0px; color: gray; }

.pa3{ font-size: 24px; text-align: justify; margin-left: -7px; margin-right: 0px; color: gray; margin-top:50px;

}

.pa4{ font-size: 24px; text-align: justify; margin-left: -7px; margin-right: 0px; color: gray; margin-top:30px;

}

5 respostas

Ivanilde, boa tarde.

Pode incluir seus blocos de código entre a marcação de três backticks (```)? Assim conseguimos visualizar melhor e tentar te ajudar no seu problema :)

Ficou um pouco desconfigurado e difícil de entender. Coloca código dentro da marcação, substituindo pelo texto "insira seu código aqui" :

```
insira seu código aqui <<<<<<<<
```

Bom dia! Segue o código.

insira seu código aqui<!DOCTYPE html>

Av. Getulio Vargas, 1580 Baeta Neves - SBC , Brasil -SP

+55 11 4444-5555

email@xxxxxx.com.br

dado

A A A A A A A A

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXy.

dado

A A A A A A A A

AAAAA + BBBBBB + XXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/p>

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX.

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

dado

A A A A A A A A

AAAAA + BBBBBB + XXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/p>

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX.

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

CSS

html{ height: 100%;

} body{

font-family: 'Lato', Helvetica, sans-serif; padding-top: 50px; background-color: white; overflow: hidden; background-color: white; font-size: 19px; margin: 10px; padding: 10px;

}

header { margin-bottom: 15px; }

button { margin: 5px; }

h1{ font-family: 'arial', cursive; color: gray; font-size: 165px; margin-top:90px; text-align: center; margin-right:0; padding-right: 0; margin-bottom: 0;

}

h2 { font-family: Arial, Helvetica, sans-serif; font-size: 47px; text-align: center; margin-top:0; padding-right: 0; color:blue; margin-bottom: 0;

}

logo{

float:center; text-align: center; position: relative; }

logo1{

float:center; text-align: center; position: top; margin-top:-100px; font-family: 'arial', cursive; color: gray; font-size: 10px; margin-top:10px; text-align: center; margin-right:0; padding-right: 0; margin-bottom: 0;

}

logo2{

float:center; text-align: center; position: top; margin-top:-500px; }

/Ajustes no Menu | Navegação/ .navbar { background: #ffffff; border: none; box-shadow: none; padding: 5px; position:fixed; text-align: center; }

.container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header { margin-top:20px; font-size:18px; margin-left:350px; position:fixed; text-align: center;

}

/FIM ajustes/

endereco

{ text-align: center; color: gray; font-size:14px; margin-bottom:50px; margin-top:10px; }

.col-md-12 { padding: 5px; margin-left: 550px; margin-top:70px; }

section { min-height: 100vh; text-align: center; margin-top:500px; } /INICIO Ajustes H2 | Vison /

.primeiro { font-size: 20px; margin-top: 200px; text-align: center; Color:gray;

}

/ FIM Ajustes H2 | Vison /

/ INICIO Ajustes PARAGRAFO VISION | Vison /

.pa1 {

font-size: 19px; margin-top: 30px; text-align: center; margin-left: -2px; margin-right: 0px; Color:gray;

}

.pa2 {

font-size: 19px; text-align: center; margin-left: -7px; margin-right: 0px; color:gray;

}

/ FIM Ajustes PARAGRAFO VISION | Vison /

/ FIM INICIO PARAGRAFO ABOUT | ABOUT / .segundo{ font-size: 40px; text-align: center; margin-left: -7px; margin-right: 0px; color: gray;

}

.segundo1{

font-size: 30px; text-align: center; margin-left: -7px; margin-right: 0px; color: gray; }

.pa3{ font-size: 24px; text-align: justify; margin-left: -7px; margin-right: 0px; color: gray; margin-top:50px;

}

.pa4{ font-size: 24px; text-align: justify; margin-left: -7px; margin-right: 0px; color: gray; margin-top:30px;

}

div { display: block; }

Você tem que colocar o código dentro dos backticks, você colocou do lado :(

``` Coloca isso no começo e no fim do código

insira seu código aqui<!DOCTYPE html>

Av. Getulio Vargas, 1580 Baeta Neves - SBC , Brasil -SP

+55 11 4444-5555

email@xxxxxx.com.br

dado

A A A A A A A A

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXy.

dado

A A A A A A A A

AAAAA + BBBBBB + XXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/p>

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX.

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

dado

A A A A A A A A

AAAAA + BBBBBB + XXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/p>

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX.

XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

css

html{ height: 100%;

} body{

font-family: 'Lato', Helvetica, sans-serif; padding-top: 50px; background-color: white; overflow: hidden; background-color: white; font-size: 19px; margin: 10px; padding: 10px;

}

header { margin-bottom: 15px; }

button { margin: 5px; }

h1{ font-family: 'arial', cursive; color: gray; font-size: 165px; margin-top:90px; text-align: center; margin-right:0; padding-right: 0; margin-bottom: 0;

}

h2 { font-family: Arial, Helvetica, sans-serif; font-size: 47px; text-align: center; margin-top:0; padding-right: 0; color:blue; margin-bottom: 0;

}

logo{

float:center; text-align: center; position: relative; }

logo1{

float:center; text-align: center; position: top; margin-top:-100px; font-family: 'arial', cursive; color: gray; font-size: 10px; margin-top:10px; text-align: center; margin-right:0; padding-right: 0; margin-bottom: 0;

}

logo2{

float:center; text-align: center; position: top; margin-top:-500px; }

/Ajustes no Menu | Navegação/ .navbar { background: #ffffff; border: none; box-shadow: none; padding: 5px; position:fixed; text-align: center; }

.container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header { margin-top:20px; font-size:18px; margin-left:350px; position:fixed; text-align: center;

}

/FIM ajustes/

endereco

{ text-align: center; color: gray; font-size:14px; margin-bottom:50px; margin-top:10px; }

.col-md-12 { padding: 5px; margin-left: 550px; margin-top:70px; }

section { min-height: 100vh; text-align: center; margin-top:500px; } /INICIO Ajustes H2 | Vison /

.primeiro { font-size: 20px; margin-top: 200px; text-align: center; Color:gray;

}

/ FIM Ajustes H2 | Vison /

/ INICIO Ajustes PARAGRAFO VISION | Vison /

.pa1 {

font-size: 19px; margin-top: 30px; text-align: center; margin-left: -2px; margin-right: 0px; Color:gray;

}

.pa2 {

font-size: 19px; text-align: center; margin-left: -7px; margin-right: 0px; color:gray;

}

/ FIM Ajustes PARAGRAFO VISION | Vison /

/ FIM INICIO PARAGRAFO ABOUT | ABOUT / .segundo{ font-size: 40px; text-align: center; margin-left: -7px; margin-right: 0px; color: gray;

}

.segundo1{

font-size: 30px; text-align: center; margin-left: -7px; margin-right: 0px; color: gray; }

.pa3{ font-size: 24px; text-align: justify; margin-left: -7px; margin-right: 0px; color: gray; margin-top:50px;

}

.pa4{ font-size: 24px; text-align: justify; margin-left: -7px; margin-right: 0px; color: gray; margin-top:30px;

}

div { display: block; }

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software