[CSS] Домашно CSS Overview - 1 задача - сезон 2012/2013


17

Нека коментираме 1ва задача от CSS Overview тук.

Ето моето решение:

https://www.dropbox.com/s/1u4fqh48cq6hyqx/01.%20SimpleTicket.rar

Този път реших да използвам Dropbox т.к. задачите вече имат повече файлове и картинки и PasteBin вече не е удачен.

Относно решението:

Най-обикновенна структура с табличка, няколко p-та вътре, няколко класа и малко цвят за вкус. Кръгчето пред името съм го направил с картинка, но може преспокойно да се направи и само със CSS.

Приемам всякакви коментари и препоръки :)


Ето линк към старата тема от мартенския крус: http://goo.gl/L9bOf


Едит: Сложих линкове, увеличих размера на box-a и увеличих шрифта на заглавието по препоръка на kirov




Отговори



1
Здравейте,
ето тук е и моето решение http://jsfiddle.net/7TU6n/. ще се радвам ако някой даде отзиви.Смятам че кода ми се получи прекалено окичен с класове и Id-та и във вразка с това искам да попитам дали е лоша практика да се слагат едновременно клас и Id към един и същ елемент?

от iyordanov (115 точки)


0
Здравей! Имаш повторение на еднакви пропъртита и стойности. Последното можеш да избегнеш по следния начин:
.font, td .space { color: #909090; } #grey, #grey2 { color: grey; }

от Flystar (1171 точки)

0
Благодаря, оправих го :)

от iyordanov (115 точки)


2

Това е решението ми за първата задача:

Задача 1

направих задачата с много класове и id-та за упражнение и направих зеленият кръг с css.


от KaloyanBobev (330 точки)


2
Някой по-опитен може ли да си даде мнението за решението на първата ми задача с CSS http://jsfiddle.net/7s8aA/

от Mart1n_Vatev (143 точки)


1

Линк към моето решение, в което всички 3 надписа с жълти букви са линкове.


от gradev (1661 точки)


0

Моето решение е с таблица, в която всеки ред си има ID. Всяка първа клетка от всеки ред е с italic font.


от dzhenko (3893 точки)


1

Ето и едно решение от мен http://jsfiddle.net/PetyaPetkova/73Xg4/.


от petyapetkova (402 точки)


0

Здравейте колеги,

Бих искал да споделя и моето решение. :)

Решение: https://github.com/MiroslavSimeonovIvanov/TelerikAcademy/tree/master/CSS_Styling_Course/CSS_Overview

Визия: https://drive.google.com/file/d/0B4osYVb7v4eReVNtYjNxQ1VRNUk/edit?usp=sharing

Понеже трейнърите ни казаха да не използваме таблиците за стилизиране, а и Mozilla (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table) също, затова логично избрах <dl>. :) Използвах id-та за - точката, червения и оранжевия шрифт, а класове за - жълтия и сребърния шрифт. Точката избрах да я направя със CSS, но така и неможах да й оправя позицията спрямо съседния текст, но мисля че накрая всичко се получи добре. :)




0
Решението да се ползва
е най-правилното и според мен.

от petyapetkova (402 точки)

0
Трябва да оправиш позиционирането на редовете, както и разстоянието между двете колони.

от elena89 (85 точки)