Skocz do zawartości

Zdjęcie
* * * * * 1 głosy

Problem ze wstawianiem tła

Rozpoczął mroczeks, cze 20 2014 19:50

Najlepsza odpowiedź Yeoman, 21 czerwca 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.

Przejdź do postu


15 odpowiedzi w tym temacie
  • Zamknięty Temat jest zamknięty
mroczeks

    Nowy użytkownik

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

Napisano 20 czerwca 2014 - 19:50

#1

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


  • 0
Michał

    Stary wyjadacz

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

Napisano 20 czerwca 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 postów
    • Czas spędzony online: 29d 22h 59m 44s
133
Znakomita!

Napisano 20 czerwca 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 postów
    • Czas spędzony online: 10d 19m 41s
14
Dobra
  • LocationKraśnik

Napisano 20 czerwca 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 postów
    • Czas spędzony online: 3h 14m 41s
-2
Neutralna

Napisano 21 czerwca 2014 - 08:43

#5

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


  • 0
writen

    Stary wyjadacz

  • 458 postów
    • Czas spędzony online: 29d 22h 59m 44s
133
Znakomita!

Napisano 21 czerwca 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 postów
    • Czas spędzony online: 6d 19h 43m 48s
169
Znakomita!
  • LocationKatowice

Napisano 21 czerwca 2014 - 09:03   Najlepsza odpowiedź

#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

  • 2 911 postów
    • Czas spędzony online: 134d 2h 28m 23s
472
Znakomita!
  • LocationToruń

Napisano 21 czerwca 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 postów
    • Czas spędzony online: 3h 14m 41s
-2
Neutralna

Napisano 21 czerwca 2014 - 10:33

#9

a jak podpiąć ten css do strony ;/


  • 0
Michał

    Stary wyjadacz

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

Napisano 21 czerwca 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 postów
    • Czas spędzony online: 3h 14m 41s
-2
Neutralna

Napisano 21 czerwca 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 postów
    • Czas spędzony online: 16d 7h 11m 3s
95
Znakomita!

Napisano 21 czerwca 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 postów
    • Czas spędzony online: 3h 14m 41s
-2
Neutralna

Napisano 21 czerwca 2014 - 12:00

#13

@Michał odczytaj wiadomości ma priv


  • 0
Yeoman

    Stary wyjadacz

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

Napisano 21 czerwca 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 postów
    • Czas spędzony online: 3h 14m 41s
-2
Neutralna

Napisano 21 czerwca 2014 - 13:25

#15

Już ogarnąłem ,cls


  • -1
zonic

    WT Elite

  • 2 911 postów
    • Czas spędzony online: 134d 2h 28m 23s
472
Znakomita!
  • LocationToruń

Napisano 21 czerwca 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

Wróć do HTML i CSS



Podone tematy Collapse

  Temat Forum Autor Podsumowanie Ostatni post

Użytkownicy przeglądający ten temat: 0

0 użytkowników, 0 gości, 0 anonimowych