| Autor | Zpráva | ||
|---|---|---|---|
| vEnom Profil * |
#1 · Zasláno: 4. 10. 2013, 17:34:00
Ahoj, chtěl bych se zeptat zda je nějaká možnost použít do samotného body {.......} použít nějak obrázek url('něco/něco.png'), v CSS Jsem začátečník, takže ještě neznám každou použitelnou funkci.
Díky |
||
| margin Profil * |
#2 · Zasláno: 4. 10. 2013, 17:56:54
|
||
| vEnom Profil * |
#3 · Zasláno: 4. 10. 2013, 18:22:39 · Upravil/a: vEnom
Dočetl jsem se o funkci background, ale není to náhodou na celou plochu?
Mám to takto a funguje to, ale je to správné použití té funkce? body {
background-color: #004150;
background-image: url('Images/user.png'); width: 150px; height: 150px; background-repeat: no-repeat;
}Menší oprava: HTML: <html> <head> <!-- Nadpis --> <title>Projekt StrangeR</title> <!-- Meta a ostatní --> <link rel="stylesheet" href="style.css"> </head> <!-- Tělo --> <body> <div id="user"></div> </body> </html> CSS: body {
background-color: #004150;
}
.user {
background-image: url('Images/user.png');
width: 150px;
height: 150px;
}A nefunguje to, proč? |
||
| weroro Profil |
vEnom:
„není to náhodou na celou plochu?“ Áno, je. Značka body určuje plochu tela stránky do ktorej sa vkladajú ostatné sémantické značky. Z pravidla by mala táto plocha pokrývať 100% výšky a šírky zobrazovanej stránky.
„A nefunguje to, proč?“ Pretože máš v HTML nastavený identifikátor ID a ten sa v CSS označuje mriežkou # #user {
background-image: url('Images/user.png');
width: 150px;
height: 150px;
}tip: Značka <body> v HTML (rovnako ako aj <html> a <head>) nie je povinná, takže ju nemusíš fyzicky zapisovať.
|
||
| vEnom Profil * |
#5 · Zasláno: 4. 10. 2013, 18:46:30
Tak jsem to taky zkoušel, jak právě teď ukazuješ, ale pak je problém v pozicích, protože dle mého to zabírá to pozadí, tudíž se to snaží hýbat s ním a tím pádem toto nejde:
margin: 20% auto; position: fixed; left: 50px; top: 150px; |
||
| weroro Profil |
#6 · Zasláno: 4. 10. 2013, 18:48:24
O čo konkrétne sa snažíš?
|
||
| vEnom Profil * |
#7 · Zasláno: 4. 10. 2013, 19:05:17
Umístit obrázek na web pouze pomocí css.
A tohle nejde: <div id="user"></div> CSS: .user {
background-image: url('Images/user.png')
width: 150px;
height: 150px;
} |
||
| margin Profil * |
#8 · Zasláno: 4. 10. 2013, 19:05:23 · Upravil/a: margin
vEnom:
„A nefunguje to, proč?“ Protože jsi v HTML na řádku 12 dal DIVu idéčko "user" a v css jsi na řádku 5 deklarovat styl pro třídu "user". O co se pokoušíš nyní, také netuším. vEnom: „A tohle nejde:“ Tatáž chyba, kterou jsem už zmínil. |
||
| vEnom Profil * |
#9 · Zasláno: 4. 10. 2013, 19:21:42
O tohle se snažím.
Umístit tu hlavu uživatele |
||
| weroro Profil |
<!DOCTYPE HTML>
<meta charset="utf-8">
<title></title>
<style type="text/css">
html,*,body{margin:0;padding:0;}
body{background:#004150;}
.wrapper{width:780px;margin:281px auto 0 auto;}
.wrapper img{float:left;}
.wrapper form{background:#fff;width:460px;padding:1px 3px;border:2px solid #000;float:right;margin:96px 0 0 0;}
.wrapper form input{border:none;padding:14px;width:370px;}
.wrapper form .button{background:#5300FE url('img/button.jpg');width:55px;height:45px;padding:5px;}
</style>
<div class="wrapper">
<img src="img/avatar.jpg" alt="avatar">
<form action="" method="post">
<input type="text" value="">
<input type="submit" value="" class="button">
</form>
</div>Živá ukážka http://temp.weroro.sk/jpw/form1/ |
||
|
Časová prodleva: 11 let
|
|||
0