Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [CSS][HTML][PHP]Tworzenie strony www z laikiem - krok po kroku, Etapy w tworzeniu strony www
Kruk1
post 2.09.2015, 15:16:30
Post #1





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 2.09.2015

Ostrzeżenie: (0%)
-----

Witam,
Będę tworzył stronę pod Allegro i potrzebuje pomocy krok po kroku



Zadanie 1

Mam tło strony podzielone na 8 części i chodzi mi aby te tło tworzyło całość od samej góry okna wyświetlania strony do samego dołu (bez żadnych przerw pomiędzy nimi, ani marginesów góra/dół). Jedynie co mi się udało to część górna marginesu "orzel_grafika/orzel_szablon_1.png" która przylega do górnego marginesu strony tak też tu nie trzeba nic zmieniać, z kolei już między poszczególnymi częściami tła jak też na marginesie dolnym występują już niestety kilkupikselowe pionowe przerwy których chciałbym się pozbyć.


Oto kod strony. Przy okazji jeśli popełniłem jakieś błędy w zapisie, proszę o pomoc w poprawce.
Linijki w zapisie, jak też przerwy występują z doładną numeracją

Cytat
<!DOCTYPE html>
<html>
<head>
<title>Logo Orzeł</title>
<meta charset="utf-8">
<style>
#tlo {background; display:block; width:1200px; margin:0 auto 0 auto; margin-top:0px; padding:0px; border=0;}
</style>

</head>

<body>
<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_1.png"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_2.png"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_3.png"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_4.png"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_5.png"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_6.png"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_7.png"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_8.png"/>
</section>

</body background>
</body>

</html>


Ten post edytował Kruk1 2.09.2015, 15:24:14
Go to the top of the page
+Quote Post
Johnas
post 3.09.2015, 19:07:38
Post #2





Grupa: Zarejestrowani
Postów: 650
Pomógł: 16
Dołączył: 5.07.2010
Skąd: Ściśle Tajne

Ostrzeżenie: (0%)
-----

do css dodaj
[CSS] pobierz, plaintext 
  1. body {margin-top:-10px;}
[CSS] pobierz, plaintext
\
kod powinien zniwelować odstęp o 10 px

a jak nie pomoże to do img... Ciężko pomóc nie widząc w czym tkwi problem. Możesz to wrzucić na serwer?

Ten post edytował GodOfPeople 3.09.2015, 19:08:47


--------------------
Jak coś jest dobre, to nie znaczy że nie może być to lepsze - Ideały nie istnieją ;D
Strony internetowe Świnoujście
Go to the top of the page
+Quote Post
MESSIAH :)
post 4.09.2015, 08:28:45
Post #3





Grupa: Zarejestrowani
Postów: 249
Pomógł: 0
Dołączył: 22.12.2011

Ostrzeżenie: (10%)
X----

Czegoś tutaj nie rozumiem albo ktoś ma problemy z nauką. Jeśli chcesz mieć całe tło to po kiego kroisz tło na kawałki? Zrób całe tło i ustaw jako tło. Tylko musisz mieć każdą podstronę mieć ze stałą wysokością a to może być kłopotliwe.


--------------------
TERA TRYBI.pl
Go to the top of the page
+Quote Post
Kruk1
post 4.09.2015, 19:41:15
Post #4





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 2.09.2015

Ostrzeżenie: (0%)
-----

Cytat(MESSIAH :) @ 4.09.2015, 09:28:45 ) *
Czegoś tutaj nie rozumiem albo ktoś ma problemy z nauką. Jeśli chcesz mieć całe tło to po kiego kroisz tło na kawałki? Zrób całe tło i ustaw jako tło. Tylko musisz mieć każdą podstronę mieć ze stałą wysokością a to może być kłopotliwe.


Eksport do PNG ma swoje ograniczenia 10 000 pikseli wysokości, a tło stanowi pewien wzór na którym zostanie zamieszczonych przeszło 70 mniejszych obrazków PNG



GodOfPeople
Udało mi się! Jednak miałeś rację, trzeba do IMG. Teraz po aktualizacji wygląda to tak:

Cytat
<!DOCTYPE html>
<html>
<head>
<title>Logo Orzeł</title>
<meta charset="utf-8">
<style>
#tlo {background; display:block; width:1200px; margin:0 auto 0 auto; margin-top:0px; padding:0px; border=0;}
</style>

</head>

<body>
<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_1.png"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_2.png" style="display:block; margin-top:-4px;"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_3.png" style="display:block; margin-top:0px;"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_4.png" style="display:block; margin-top:0px;"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_5.png" style="display:block; margin-top:0px;"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_6.png" style="display:block; margin-top:0px;"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_7.png" style="display:block; margin-top:0px;"/>
</section>

<body background id="tlo">
<section id="head">
<img src="orzel_grafika/orzel_szablon_8.png" style="display:block; margin-top:0px;"/>
</section>

</body background>
</body>

</html>



Za jakiś czas wróce z kolejnym zadaniem

Zadanie 2 - guziki menu




Poniższy rysunek przedstrawia ścieżki PNG (z małej litery) z obrazkami pod guziki menu + napisy, trzy podstawione są pod każdy kwadracik. Jak widać dokładnie na rogach kwadraciki stykają się ze sobą. Bardzo bym prosił o pomoc w napisaniu kodu pod takowe guziki, wszelkie wymiary względem osi pikseli mogą być przykładowe. Ważne też aby pozbyć się efektu przerywanej obwódki podczas naciśniętego guzika. Jeżeli to ma jakieś znaczenie, menu będzie się znajdowało w pierwszej cześci tła "orzel_szablon_1".

Guzik1 odwołuje się do podstrony (przykładowo)
Guzik6 - po jego naciśnięciu ma wyskoczyć okienko z e-mail
Guzik7 - ma być odnośnikiem do fanpage'a na facebooku (przykładowo)

Pozostałe guziki odwołują się do poszczególnych działów Allegro

Proszę się podpierać danymi poniższego kodu HTML.






Ten post edytował Kruk1 4.09.2015, 16:31:05
Go to the top of the page
+Quote Post
Fred1485
post 4.09.2015, 20:34:07
Post #5





Grupa: Zarejestrowani
Postów: 361
Pomógł: 22
Dołączył: 10.02.2015

Ostrzeżenie: (0%)
-----

Czekasz na gotowca?


--------------------
[PHP] pobierz, plaintext 
  1. echo 'I was trying';
  2. die ();
[PHP] pobierz, plaintext
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 25.04.2024 - 03:12
Powered By IP.Board © 2024  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn