Skocz do zawartości
Pecetowicz Forum komputerowe

Egzamin z kwalifikacji E.14. Strona internetowa. HTML / CSS


Rekomendowane odpowiedzi

Gość Kamil

Witam! Potrzebuje pomocy, próbuje się uczyć do egzaminów na Technika Informatyka z kwalifikacji E14 i mam problem z tym zadaniem:

Arkusz E.14-06-19.06 - Wykonaj aplikację internetową firmy zajmującej się usługami informatycznymi.

Wykorzystaj do tego celu edytor zaznaczający składnię oraz program do obróbki grafiki rastrowej. Przygotuj, przy pomocy programu do obróbki grafiki rastrowej i pliku mysz.jpg, dwa banery, według poniższych wytycznych [...]

chodzi mi oto zadanie z tą myszką, czy by ktoś mi pomogł ? I wytłumaczyć kod? 

Odnośnik do odpowiedzi
Udostępnij na innych stronach
  • Administrator
Napisano (edytowane)

A więc tak Kamilu, styl.css może wyglądać następująco:

Spoiler


body{
      /* Kolor tła według tego co w arkuszu */
      background-color: #99FF66;
}

.kontener{
      /* Ustalamy szerokość */
      width: 1000px;
      
      /* marginesy zewnętrzne automatyczne */
      margin: 0 auto;
}

.baner{
      /* Tło */
      background-color: #99FFCC;

      /* Wysokość */
      height: 200px;
}

.menu{
      /* Kolor tła */
      background-color: #66CCFF;

      /* Wyrównanie do środka */
      text-align: center;

      /* Górny i dolny margines wewnętrzny */
      padding: 20px 0;
}

/* Odnośniki z bloku menu */
.menu a{
      /* Kolor */
      color: #006666;

      /* Margines wewnętrzny */
      padding: 50px;

      /* Rozmiar czcionki */
      font-size: 200%;

      /* Bez podkreślenia */
      text-decoration: none;
}

.kolumna{
      /* Szerokość */
      width: 310px;

      /* Margines wewnęrzny */
      padding: 10px;


      /* Nie wiem czy na to zezwalają ale żeby były obok siebie to trzeba użyć czegoś takiego*/
      display: inline-block;
      
      /* A to aby były "przyklejone" do góry */
      vertical-align: top;
}

.stopka{
      background-color: #66CCFF;
      color: #006666;
      text-align: right;
      height: 30px;
      padding: 20px;
}

h2, h3{
      text-align: center;
}

/* Przycisk reset w formularzu */
form button[type="reset"]{
      background-color: #ff0000;
}

/* Przycisk wysyłający formularz */
form button[type="submit"]{
      background-color: #00ff00;
}

 

Mam nadzieję, że o to chodziło. Niestety nie wiem jak was w szkole przygotowują więc polegam na swoim doświadczeniu gdy byłem w technikum i z czym nie było problemu na egzaminie. Podany kod musisz sobie dostosować pod siebie i swoje nazewnictwo dla danych klas bloków/sekcji.

 

Nie wiem też czy Cię te tematy z tworzeniem stron interesują ale tak na koniec napiszę - że to co się uczy w technikum na zajęciach odnośnie stron to ponad 70% rzeczy wyszło z użycia i w obecnym internecie stosuje się bardziej wygodniejsze techniki 😉

Edytowane przez Mativve
Odnośnik do odpowiedzi
Udostępnij na innych stronach
Gość Kamil


Pan zrobił to zadanie na dole, a ja potrzebuje to zadanie u góry. To zadanie z formularzem sobię poradziłem i mam HTML I CSS i jest podobny, aczkolwiek mi chodzi o HTML i CSS o zadanie wyżej http://egzamin-e14.blogspot.com/2019/10/arkusz-e14-06-1906.html

Chodzi o to:

https://1.bp.blogspot.com/-uPOC0vHCa60/XZiY9pU6wmI/AAAAAAAAEDc/ZrJjHwhb39gGVZtWvHacjykAF13J8gQogCLcBGAsYHQ/s400/z.png

Odnośnik do odpowiedzi
Udostępnij na innych stronach
  • Administrator
Napisano (edytowane)

Oj Kamilu to źle wytłumaczyłeś - chodzi Ci w takim razie o grafikę? O baner i favicon?

To musisz zrobić w programie graficznym takim jaki Twoja szkoła dostarcza (Gimp lub Photoshop)

 

PS: (Prosiłbym abyś nie dublował odpowiedzi 😉)

Edytowane przez Mativve
Odnośnik do odpowiedzi
Udostępnij na innych stronach
Gość Kamil

Tak o to chodzi co wyzej napisaleś. Tylko, że ja chce zrobić to zadanie bez użycia programu graficznego żeby bylo tak jak tam na zdjęciu 

Odnośnik do odpowiedzi
Udostępnij na innych stronach
  • Administrator

Okej to powiedz mi co z tych grafik tam masz?

Bo niestety favicon nie dasz rady zrobić bez grafiki (a na wyższym poziomie wiedzy mógłbyś to uzyskać przy pomocy base64 ale ta wiedza raczej nie jest Ci znana).

Jeśli chcesz zrobić ten baner w kodzie no to podobnie jak w przypadku kolumn tworzysz 3 tylko że boczne (1 i 3) robisz np.: na szerokość 100px a wiedząc że cała strona ma 1000px łatwo to obliczyć ile ma mieć środkowa część

100 + 100 = 200

1000 - 200 = 800

800px będzie miała środkowa część czyli kolumna 2 i do niej wsadzasz tekst a do bocznych grafikę

Odnośnik do odpowiedzi
Udostępnij na innych stronach
  • Założyciel
Odnośnik do odpowiedzi
Udostępnij na innych stronach
Gość
Dodaj odpowiedź do tematu...

×   Wklejono zawartość z formatowaniem.   Przywróć formatowanie

  Dozwolonych jest tylko 75 emoji.

×   Odnośnik został automatycznie osadzony.   Przywróć wyświetlanie jako odnośnik

×   Przywrócono poprzednią zawartość.   Wyczyść edytor

×   Nie możesz bezpośrednio wkleić obrazków. Dodaj lub załącz obrazki z adresu URL.

Ładowanie
×
×
  • Dodaj nową pozycję...