rickusdov

Kaip nuotrauka talpinti svetainės centre?

Recommended Posts

Parašė (redaguota)

Sveiki, atsisiunčiau html dizainą ir norėjau jį koreguoti, bet kažką pridariau ir mano nuotrauką ir mygtukai, kurie buvo centre nukilo į viršų. Gal kas turi patarimų? Ar įmanoma per index.html pakoreguot tai ar per .css? Ir ką reiktų daryt?

 

index.html kodas:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>---</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=yes">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/open-iconic-bootstrap.min.css">
    <link rel="stylesheet" href="css/icomoon.css">
    <link rel="stylesheet" href="css/style.css">
  </head>
  <body> 
  	<style>
.aligncenter {
    text-align: center;
}
</style>  

    


    <section class="coveris1 align-items-center-center text-center">
	
        <div class="coveris2 align-items-center-center text-center">
          <div class="col-sm align-items-center-center ">
            <div class="probootstrap-text align-items-center-center ">
           <img src="images/logo.png" alt="centered image" />
	        	
				
			<div class="button">             
              <a href="#" class="btn">//GITHUB</a>
              <a href="#" class="btn">//KLASE</a>
              <a href="#" class="btn">//MASINOS</a>
              <a href="#" class="btn">//EGZAMINAS</a> 
            </div>
         </div>
       </div> 
  
      
    </section>          
  </body>

</html>

Kaip dabar atrodo:

e0736627918f99449d0b5fa0d5b40faf811.PNG

Redaguota , nario rickusdov

Dalintis šį pranešimą


Nuoroda iki šio pranešimo
Dalintis per kitą puslapį

Parašė (redaguota)
3 minutes prieš, mfacclt parašė:

O kaip turetu atrodyt? ?

Aš noriu kad būtų mygtukai, bei nuotrauka viso vaizdo centre. Dabar visa tai viršuj, o man reikia per vidurį

b6d9293b7f6694e61eddc9ec4a3ff59f274.pngMygtukai su nuotrauka būtų kur yra baltas stačiakampis

Redaguota , nario rickusdov

Dalintis šį pranešimą


Nuoroda iki šio pranešimo
Dalintis per kitą puslapį
Parašė (redaguota)
38 minutes prieš, Player1337 parašė:

https://jsfiddle.net/4m1pvtrf/

Naudok <center> textas </center> ir viskas

<center>
Belekas
</center>

<center> tagas nėra naudojamas, taip, jis darbą atlieką, bet jis neturėtų būti naudojamas. O ypač, kai HTML5 jo nepalaiko.

Vertical align variantai:

.div {
	position: absolute;
	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
}
.div {
 	display: flex;
  	justify-content: center;
  	align-items: center;
}

 

Redaguota , nario mariusqw

Dalintis šį pranešimą


Nuoroda iki šio pranešimo
Dalintis per kitą puslapį
38 minutes prieš, mariusqw parašė:

<center> tagas nėra naudojamas, taip, jis darbą atlieką, bet jis neturėtų būti naudojamas. O ypač, kai HTML5 jo nepalaiko.

Vertical align variantai:

.div {
	position: absolute;
	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
}
.div {
 	display: flex;
  	justify-content: center;
  	align-items: center;
}

 

Šitas padėjo, dėkuj

Dalintis šį pranešimą


Nuoroda iki šio pranešimo
Dalintis per kitą puslapį

Prisijungti prie diskusijos

Palikti atsakymą galite iš karto, o užsiregistruoti vėliau. Jeigu jau turite paskyrą mūsų forume, Prisijunkite.

Svečias
Atsakyti šioje temoje...

×   Įklijuotas tekstas turi teksto formatavimą.   Pašalinti teksto formatavimą

  Galimi tik 75 veidukai.

×   Nuoroda buvo automatiškai įterpta.   Įterpti nuorodą paprastai

×   Jūsų ankstesnis pranešimas buvo atkurtas.   Išvalyti redaktorių

×   You cannot paste images directly. Upload or insert images from URL.


  • Šiame puslapyje naršo:   0 nariai

    Nėra registruotų narių peržiūrinčių šį forumą.

  • eneba
  • eneba
  • eneba



  • SuperGames programele
  • SuperGames programele