Zaloguj się

malenka1990 · 22-01-2011, 19:31

Witam.
Mam problem .. zadali mi na studiach takie zadanie:
Stworzyć stronę HTML wykorzystującą style
Style zdefiniowane w pliku zewnętrznym
Minimum 5 selektorów, każdy mający minimum 2 cechy
Kodowanie znaków „windows-1250”
Na belce napis tytułowy „Imię Nazwisko, nr grupy – moja strona zrobiona w XHTML”
Słowa kluczowe: HTML, XHTML, webmaster
Kolor tła strony – inny niż biały
Tytuł 2 stopnia „Jakiś tekst”
Pozioma linia
Akapit napisany pogrubioną i podkreśloną czcionką: „Uwielbiam tworzyć strony internetowe!”
Strona musi przejść walidację XHTML!
Plik musi być zapisany w notatniku

a jestem kompletnie zielona z tego.. proszę o pomoc i będę bardzo wdzięczna.
pozdrawiam

Pedro84 · 22-01-2011, 21:32

kurs.browsehappy.pl/ i jedziesz.

Co za studia?

**Kartofelek** · 22-01-2011, 23:57

Plik musi być zapisany w notatniku - nosz kurde....

KeeL · 23-01-2011, 00:03

(22-01-2011, 23:57)Kartofelek napisał(a): Plik musi być zapisany w notatniku - nosz kurde....

Co to za problem?

Ogólnie do autora, to jest z 40min dla kogoś początkującego z kursem.

**Kartofelek** · (Ten post był ostatnio modyfikowany: 23-01-2011, 00:23 przez Kartofelek.)

Co to za problem? Duży!
1) BOOM problem
2) UTF problem
3) Brak kolorowania składni
4) Undo problem

Jak się już uczy tworzenia stron, to powinno się uczyć dobrych nawyków a nie by tylko naklepać godzin.

Wracając do tematu:
-------------------------

Tworzysz sobie 2 pliki: jeden nazywa się index.html i drugi nazywa się style.css, Oba zapisujesz w tym samym katalogu.
Do index.html wstawiasz to:

Kod:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=windows-1250" />

    <meta name="description" content="Krótki opis co zawiera strona. Ważne dla wyszukiwarki typu wp.pl" />

    <meta name="keywords" content="HTML, XHTML, webmaster" />

    <title> Imię Nazwisko, nr grupy – moja strona zrobiona w XHTML </title>

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

</head>

<body>

    <div class="container">

        <h1 class="head">

            Wiersze

        </h1>

        <hr />

        <h2 class="subtitle">

            Julian Tuwim - Lokomotywa

        </h2>

        <p>

        Stoi na stacji lokomotywa,<br />

        Ciężka, ogromna i pot z niej spływa -<br />

        Tłusta oliwa.<br />

        Stoi i sapie, dyszy i dmucha,<br />

        Żar z rozgrzanego jej brzucha bucha:<br />

        Buch - jak gorąco!<br />

        Uch - jak gorąco!<br />

        Puff - jak gorąco!<br />

        Uff - jak gorąco!<br />

        Już ledwo sapie, już ledwo zipie,<br />

        A jeszcze palacz węgiel w nią sypie.<br />

        Wagony do niej podoczepiali<br />

        Wielkie i ciężkie, z żelaza, stali,<br />

        I pełno ludzi w każdym wagonie,<br />

        A w jednym krowy, a w drugim konie,<br />

        A w trzecim siedzą same grubasy,<br />

        Siedzą i jedzą tłuste kiełbasy.<br />

        A czwarty wagon pełen bananów,<br />

        A w piątym stoi sześć fortepianów,<br />

        W szóstym armata, o! jaka wielka!<br />

        Pod każdym kołem żelazna belka!<br />

        W siódmym dębowe stoły i szafy,<br />

        W ósmym słoń, niedźwiedź i dwie żyrafy,<br />

        W dziewiątym - same tuczone świnie,<br />

        W dziesiątym - kufry, paki i skrzynie,<br />

        A tych wagonów jest ze czterdzieści,<br />

        Sam nie wiem, co się w nich jeszcze mieści.<br />

        </p>

        <p>

        Lecz choćby przyszło tysiąc atletów<br />

        I każdy zjadłby tysiąc kotletów,<br />

        I każdy nie wiem jak się natężał,<br />

        To nie udźwigną - taki to ciężar!<br />

        </p>

        <p>

        Nagle - gwizd!<br />

        Nagle - świst!<br />

        Para - buch!<br />

        Koła - w ruch!<br />

        </p>

        <p>

        Najpierw<br />

        powoli<br />

        jak żółw<br />

        ociężale<br />

        Ruszyła<br />

        maszyna<br />

        po szynach<br />

        ospale.<br />

        Szarpnęła wagony i ciągnie z mozołem,<br />

        I kręci się, kręci się koło za kołem,<br />

        I biegu przyspiesza, i gna coraz prędzej,<br />

        I dudni, i stuka, łomoce i pędzi.<br />

        </p>

        <p>

        A dokąd? A dokąd? A dokąd? Na wprost!<br />

        Po torze, po torze, po torze, przez most,<br />

        Przez góry, przez tunel, przez pola, przez las<br />

        I spieszy się, spieszy, by zdążyć na czas,<br />

        Do taktu turkoce i puka, i stuka to:<br />

        Tak to to, tak to to, tak to to, tak to to,<br />

        Gładko tak, lekko tak toczy się w dal,<br />

        Jak gdyby to była piłeczka, nie stal,<br />

        Nie ciężka maszyna zziajana, zdyszana,<br />

        Lecz fraszka, igraszka, zabawka blaszana.<br />

        </p>

        <p>

        A skądże to, jakże to, czemu tak gna?<br />

        A co to to, co to to, kto to tak pcha?<br />

        Że pędzi, że wali, że bucha, buch-buch?<br />

        To para gorąca wprawiła to w ruch,<br />

        To para, co z kotła rurami do tłoków,<br />

        A tłoki kołami ruszają z dwóch boków<br />

        I gnają, i pchają, i pociąg się toczy,<br />

        Bo para te tłoki wciąż tłoczy i tłoczy,<br />

        I koła turkocą, i puka, i stuka to:<br />

        Tak to to, tak to to, tak to to, tak to to!...<br />

        </p>

    </div>

</body>

</html>

Do style.css wstawiasz to:

Kod:
/* stylowanie */

    body {

        background:#FFDBFC;  

        margin:0; 

        font-family:Arial;

        color:#293134;

        text-align:center;

    }

    .container {

        width:700px;

        margin:0 auto;

    }

    h1.head {

        font-size:40px;  

        margin:50px;

    }

    h2.subtitle {

        font-size:26px;

        margin:20px;

    }

    p {

        font-weight:bold;

        font-style:italic;

        text-align:left;

        margin-left:200px;

        font-size:13px;

    }

    hr {

        width:100%;

        height:1px;

        border:0;

        border-bottom:10px solid #7C2776;

    }

I zmień odpowiednio to co chcesz.

Żeby cię ten pro nie nagiął:

margin:0 <- nie chcemy mieć marginesów wokół strony
font-family:Arial <- krój czcionki
margin:0 auto <- chcemy mieć wycentrowane na stronie

Z resztą sobie poradzisz.

nst · 23-01-2011, 04:31

Dodam tylko - zmień sobie treść w "Description" ;D

Zaloguj się
Login:
Hasło:	Nie pamiętam hasła
	Zapamiętaj mnie