Jump to content

Photo
* * * * * 1 votes

Problem ze wstawianiem tła

Rozpoczął mroczeks, Jun 20 2014 19:50

Best Answer Yeoman, 21 June 2014 - 09:03

html:

<html>
<head>
    <title>MroczekWeb</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
    <div class="pageContent">MroczekWeb</div>
</body>
</html>

css:

body {
    margin:0px;padding:0px;
    background: #0771e8 url('tlo.jpg');
}

.pageContent {
    border-top: 1px solid #ffe100; color:#ffffff;
    height: 100px;
    width: 100%;
    top: 0px;
    left: 0;
    z-index: 0;
    position: relative;
    background: #ffe100 ;
    font-size: 56px;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 2px -1px;
}

Lepiej stworzyć osobny plik *.css i go podpiąć do strony niż uzywać styli liniowych w kodzie html.

Elementy strony zawsze wrzucaj pomiędzy <body>.

 

Jeśli nie wiesz co się dzieje nadal z kodem - pisz na forum. Chętnie pomożemy.

 

Pozdrawiam.

Go to the full post


15 replies to this topic
  • This topic is locked This topic is locked
mroczeks

    Nowy użytkownik

  • 7 posts
    • Czas spędzony online: 3h 14m 41s
-2
Neutralna

Posted 20 June 2014 - 19:50

#1

temat do zamknięcia,już ogarnąłem 


  • 0
Michał

    Stary wyjadacz

  • 301 posts
    • Czas spędzony online: 16d 7h 11m 3s
95
Znakomita!

Posted 20 June 2014 - 20:19

#2

Doucz się jeszcze CSS'a, bo na razie masz wyrobiony zły nawyk wstawiania do każdego elementu kodu css. Ustaw mu klasę i w osobnym pliku (który będziesz mógł później zkeszować) ostyluj ten element.

body {
	background: url(link-do-tła);
} 

  • 1
writen

    Stary wyjadacz

  • 458 posts
    • Czas spędzony online: 29d 23h 2m 34s
133
Znakomita!

Posted 20 June 2014 - 20:38

#3
Czy ja na telefonie źle widze czy wstawiles diva przed body?

Wysyłane z mojego LG-E400 za pomocą Tapatalk 2
  • 0

logo-green-dark.png

wolfdz

    Stary wyjadacz

  • PipPipPip
  • 252 posts
    • Czas spędzony online: 10d 19m 41s
14
Dobra
  • LocationKraśnik

Posted 20 June 2014 - 21:01

#4

Czy ja na telefonie źle widze czy wstawiles diva przed body?

Wysyłane z mojego LG-E400 za pomocą Tapatalk 2

 

Dobrze widzisz ;)

 

 

Wywal tego diva przed <body> i zrób to co Ci napisał Michał.


  • 1
mroczeks

    Nowy użytkownik

  • 7 posts
    • Czas spędzony online: 3h 14m 41s
-2
Neutralna

Posted 21 June 2014 - 08:43

#5

to możecie mi poprawić ten kod ? dam lajki na szybko potrzebuje


  • 0
writen

    Stary wyjadacz

  • 458 posts
    • Czas spędzony online: 29d 23h 2m 34s
133
Znakomita!

Posted 21 June 2014 - 09:01

#6
Jedna kwestia do wyjasnienia. To nie jest mpc, tu sie nie robi za lajki. Lajki to nie jest czynnik motywujacy.
Chetnie bym ci pomogl, ale moj telefon mnie bardzo ogranicza.

Moze sproboj sam wpasc na to jak ten kod powinien wygladac. Uczysz sie html'a? Zacznij od podstaw na kurshtml.edu.pl

Wysyłane z mojego LG-E400 za pomocą Tapatalk 2
  • 2

logo-green-dark.png

Yeoman

    Stary wyjadacz

  • 358 posts
    • Czas spędzony online: 6d 19h 43m 48s
169
Znakomita!
  • LocationKatowice

Posted 21 June 2014 - 09:03   Best Answer

#7

html:

<html>
<head>
    <title>MroczekWeb</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
    <div class="pageContent">MroczekWeb</div>
</body>
</html>

css:

body {
    margin:0px;padding:0px;
    background: #0771e8 url('tlo.jpg');
}

.pageContent {
    border-top: 1px solid #ffe100; color:#ffffff;
    height: 100px;
    width: 100%;
    top: 0px;
    left: 0;
    z-index: 0;
    position: relative;
    background: #ffe100 ;
    font-size: 56px;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 2px -1px;
}

Lepiej stworzyć osobny plik *.css i go podpiąć do strony niż uzywać styli liniowych w kodzie html.

Elementy strony zawsze wrzucaj pomiędzy <body>.

 

Jeśli nie wiesz co się dzieje nadal z kodem - pisz na forum. Chętnie pomożemy.

 

Pozdrawiam.


  • 2

2ed58r7.png

zonic

    WT Elite

  • 2911 posts
    • Czas spędzony online: 134d 2h 28m 23s
472
Znakomita!
  • LocationToruń

Posted 21 June 2014 - 09:13

#8

http://jsfiddle.net/QnrJn/

 

Pattern tła jest do poprawy. Przy powielaniu widać krawędzie :)


  • 1

Papierowe wizytówki NFC

mroczeks

    Nowy użytkownik

  • 7 posts
    • Czas spędzony online: 3h 14m 41s
-2
Neutralna

Posted 21 June 2014 - 10:33

#9

a jak podpiąć ten css do strony ;/


  • 0
Michał

    Stary wyjadacz

  • 301 posts
    • Czas spędzony online: 16d 7h 11m 3s
95
Znakomita!

Posted 21 June 2014 - 10:46

#10

W sekcji <head> dodaj:

<link rel="stylesheet" type="text/css" href="link_do_pliku.css">

  • 0
mroczeks

    Nowy użytkownik

  • 7 posts
    • Czas spędzony online: 3h 14m 41s
-2
Neutralna

Posted 21 June 2014 - 11:01

#11

i jak dodam ten kod co napisał yeoman nie zniknie mi ten pasek o góry z napisem mr0czek web?


  • -1
Michał

    Stary wyjadacz

  • 301 posts
    • Czas spędzony online: 16d 7h 11m 3s
95
Znakomita!

Posted 21 June 2014 - 11:36

#12

Chodzi Ci o title? Nie- nie zniknie.
 
Nie doczytałem kodu Yeoman'a- tam już wszystko masz.


  • 2
mroczeks

    Nowy użytkownik

  • 7 posts
    • Czas spędzony online: 3h 14m 41s
-2
Neutralna

Posted 21 June 2014 - 12:00

#13

@Michał odczytaj wiadomości ma priv


  • 0
Yeoman

    Stary wyjadacz

  • 358 posts
    • Czas spędzony online: 6d 19h 43m 48s
169
Znakomita!
  • LocationKatowice

Posted 21 June 2014 - 13:22

#14

Po prostu stwórz dwa pliki:

 

index.html oraz style.css

 

następnie pierwszy kod który Ci podałem, wklej do index.html, a drugi wklej do pliku style.css.

 

Kod który podpina CSS w tym przypadku to (już masz go w czwartej linijce kodu HTML):

<link rel="stylesheet" type="text/css" href="style.css">

Ten kod podpinasz w sekcji <head>

Weź to sobie skopiuj i potestuj u siebie na stronie.


  • 1

2ed58r7.png

mroczeks

    Nowy użytkownik

  • 7 posts
    • Czas spędzony online: 3h 14m 41s
-2
Neutralna

Posted 21 June 2014 - 13:25

#15

Już ogarnąłem ,cls


  • -1
zonic

    WT Elite

  • 2911 posts
    • Czas spędzony online: 134d 2h 28m 23s
472
Znakomita!
  • LocationToruń

Posted 21 June 2014 - 17:35

#16

Już ogarnąłem ,cls

Przez takie zagrywki jak twoje, z czyszczeniem tematu po rozwiązaniu problemu, musiałem ograniczyć możliwość edycji do 30 minut. Chłopaki się starają ci wytłumaczyć, być może przydałoby się to komuś w przyszłości, a ty od tak czyścisz temat i cholera wie o co w nim chodziło :)


  • 1

Papierowe wizytówki NFC

Back to HTML i CSS



Podone tematy Collapse

  Topic Forum Started By Stats Last Post Info

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users