Loading...
rafatpc avatar rafatpc 52 Точки

[Homework] HTML основи

Първото домашно от курса :)

 

Свали

 

EDIT: Малко съм изпуснал една част от 5-тата задача... не съм сложил margin на div-овете :D Решението е простичко, разбира се: margin: 0px 60px 0px 60px;

Тагове:
7
Web Fundamentals - HTML5
GoShow avatar GoShow 595 Точки

Ето го и моето домашно, по-добре късно :). CSS файловете и снимките са във css и images папките.

2
BoYaN avatar BoYaN 336 Точки

Здравейте,

Ето и моите решения на домашното HTML основи. Стиловете са зададени в хедъра, но така ми се струва, че ще е по-лесно за проверка, затова не съм ги изнесъл в отделен CSS файл. На тези линкове може да видите какво се е получило.

01. Hello HTML.html
02. Paragraphs and Images of Text.html
03. Runners Home.html
04. HTML Lists.html
05. PowerPoint Slide.html

06. Home.html
06. Profile.html
06. Friends.html

Тук може да разгледате кодът в GitHub.

Поздрави

0
Yulia avatar Yulia 1346 Точки

И аз малко късно споделям решенията си, но съм перфекционист и исках да изчистя всички детайли :) За IDE реших да разуча Web Storm.

2. Fancy ParagraphsLive Demo | HTML Code | CSS Code
На тази задача си поиграх със sub и sup, като направих нещо като стрелкичка :D

5. Presentation Slide Live DemoHTML Code | CSS Code
Мислех, че това е най-трудната задача и я оставих за накрая, но след 6-та, тази се оказа детка работа. За background взех скрийншот от празен слайд в презентациите. Отгоре има само едно заглавие и 3 отделни списъка с по 1 елемент. Между тях са кутийките като div-ове. На списъците сложих общ клас, на кутийките също - и стана много лесно, защото стиловете за тях са абсолютно същите. За по-специални корекции използвах id-та. И валидатора изписа Success от раз :)

6. Grumpy Cat's Profile - Live Demo | Source
Ееето тук си чупих главата 2 дни. Понеже Doge не ме изкефи, реших да си направя нещо друго. Но срещнах много много проблеми. HTML... почти няма. По 30 реда код е (с повторенията, които ми бъркат в здравето, но които все пак се въздържах да извадя отделно). Голяма занимавка беше стилизирането и по-скоро това, че се захванах да пиша всичко в проценти (даже се е получило нещо като responsive). Но най-гадно беше позиционирането на картинките спрямо другите елементи. Докато не минат всички възможни комбинации между block, inline-block, absolute и relative - нищо не работеше както трябва. Благодаря на асистентите за помощта, защото на моменти вече наистина се ядосвах на css-а и ми идеше да я зарежа тази задача. Но смятам, че научих доста неща и страхотно упражних както css-а, така и търпението си.

Другите задачи не са нищо различно и интересно, но все пак може да погледнете кода тук.

4
jabalka avatar jabalka 960 Точки

О, Юле, задачата ти за котките простоооо :):):) 

1
Yulia avatar Yulia 1346 Точки

О, добре, че беше ти, Яна. Иначе заповядвам в css-а на картинката "център", ама гръмпи кет се мръщи и... "No!" :D Благодаря за помощта : )

1
nikbikbank avatar nikbikbank Trainer 76 Точки

Ето и моето решение тук. Ще се радвам да кажете кое ви харесва и кое не :)

1
Ventsislav avatar Ventsislav 343 Точки

Ето го и моето домашно : цък . Ако имате някакви забележки , моля пишете.

1
Masovski avatar Masovski 211 Точки

Ето и моето домашно. Надявам се да е полезно на някого. 

 

2. Hello HTML  Preview -  HTML Code -  CSS Code
3. Paragraphs and Images of Text     Preview -  HTML Code  CSS Code
4. The Runners Home  Preview -  HTML Code  CSS Code
5. HTML Lists  Preview -  HTML Code  CSS Code
6. PowerPoint Slide  Preview -  HTML Code  CSS Code
7.1 Home page  Preview -  HTML Code  CSS Code
7.2 Profile page  Preview -  HTML Code  CSS Code
7.3 Friends Page  Preview -  HTML Code  CSS Code
0
Можем ли да използваме бисквитки?
Ние използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Можете да се съгласите с всички или част от тях.
Назад
Функционални
Използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Използваме „сесийни“ бисквитки, за да Ви идентифицираме временно. Те се пазят само по време на активната употреба на услугите ни. След излизане от приложението, затваряне на браузъра или мобилното устройство, данните се трият. Използваме бисквитки, за да предоставим опцията „Запомни Ме“, която Ви позволява да използвате нашите услуги без да предоставяте потребителско име и парола. Допълнително е възможно да използваме бисквитки за да съхраняваме различни малки настройки, като избор на езика, позиции на менюта и персонализирано съдържание. Използваме бисквитки и за измерване на маркетинговите ни усилия.
Рекламни
Използваме бисквитки, за да измерваме маркетинг ефективността ни, броене на посещения, както и за проследяването дали дадено електронно писмо е било отворено.