Домашно CSS Overview - 1 зад. Въпроси § Отговори


10
Тук обсъждайте 1 задача от първата лекция за CSS - Overview.



Отговори



0
И по двата начина ли тябва да направим задачата (с таблица и с
)?

от emilkova (80 точки)


0
по който от 2та искаш

от paveld3 (17458 точки)


-9

Да вземете да качите и видеото ли ? 


от Georgi Markov (0 точки)


1
Зеленото кръгче картинка ли е?

от e_manev (25 точки)


0
Да! Пиши в гугал green circle icon, дай на малки изображения и си готов.

от Viktor_Ivanov (2505 точки)

0
или просто влезни в paint и си нарисувай 1 кръгче.

от peter (559 точки)



1

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

Ако си мислите, че в един "definition list" или "dl" може да имате само един "dt" и един "dd" и след това пак да започва с "dt" значи това, което пиша е за вас ;).

И така, в първата задача за CSS-a може да ви се наложи да използвате няколко поредни "dd",  ако отхвърлите варианта да го правите с таблица. Запомнете, че може да използвате няколко поредни "dd". Давам ви следния пример:

<dl>
    <dt>happiness</dt>
        <dd>/'hæ p. nes/</dd>
        <dd>n.</dd>
        <dd>The state of being happy.</dd>
        <dd>Good fortune; success. Oh happiness! It worked!</dd>
    <dt>rejoice</dt>
        <dd>/ri jois'/</dd>
        <dd>v.intr. To be delighted oneself.</dd>
        <dd>v.tr. To cause one to be delighted.</dd>
</dl>

В браузъра това би изглеждало така:
http://pastehtml.com/view/bu3paaqep.html

За любознателните: източник

Поздрави,
Георги Янков


от georgi.s.yankov (6219 точки)


3

Една подсказка за зеленото кръгче - можете да ползвате <span>&bull;</span> и после намерете начин да го направите зелено и голямо :)


от paveld3 (17458 точки)


0
Да, със би било по- добре, защото ще е по-оптимизирано откъм трафик, отколкото с изображение. А за тези, които са решили да го правят с изображение - съветвам ви да е PNG, за да нямате бял правоъгълник на сивия фон около кръгчето (фона на таблицата както виждате трябва да е сив). За повече инфо гугълнете PNG transperency или PNG alpha channel.

от bakalov85 (604 точки)

0
И аз пробвах &bull, но си е играчка, а картинката ми е 14x14 5К и е къде, къде по-лесно :) Хубаво е, че винаги има поне 2 начина за постигане на резултата.




1
Аз имам следния въпрос. След като се вижда, че текста във всички клетки на таблицата (то само по Name и Last Action си личи) e в горния ляв ъгъл реших да го напиша в селектора table, защото това важи за цялата таблица:
table {text-alignmnet:left; vertical:align:top;}
И така се подравни в ляво, ама не се качи горе. Защо?
Нещата се оправиха, като преместих пропъртито vertical-align в селектора td и нещата станаха така:
table {text-align:left;}
td {vertical-align:top;}
Защо не става когато vertical-align е в декларационния списък на селектора table?

от bakalov85 (604 точки)


0
vertical:align:top ти е грешката - vertical-align: top трябва да е

от paveld3 (17458 точки)

0
Пардон, само тук във форума съм го объркал. В домашното съм си го писал правилно: vertical-align. Ето го CSS файла ми: http://pastebin.com/y9j3twNz Ето го и HTML: http://pastebin.com/SaGdkqs7

от bakalov85 (604 точки)



0

 

на предпоследния ред, където пише "Link to public post" , това някакъв линк ли е или просто текст? 

Или в крайна сметка няма значение, стига да му е приложен стил? 

 


от alloces (280 точки)


0
Лично аз потърсих нещо общо между всички редове, като гледах и използваните цветове. Очевидно "Link to public post" трябва да е линк, но и там, където е имейлът също трябва да е линк. Обърни внимание, че споменатите два реда са в жълт цвят. По тази логика направих и "Parker Seidel" също линк, тъй като той е със същия цвят - жълт.
Дали е вярно? Незнам, но търсих някаква логика ;).

от georgi.s.yankov (6219 точки)

0
Точно защото и аз се опирам на същата логика спрямо цветовете, та за това и питах ;)

от alloces (280 точки)


0

Колеги нeщо зациклих. Значи опитвам се да реализирам задачата чрез таблица. Проблемът ми идва от там, че не мога да преместя name да стои срещу Parker Seidel и също така Last Action срещу Never been locked. Някой има ли представа как мога д аго направя или проблемът идва, че можеби грешно съм подхванал задачата.

За момента съм поставил бордер да видя кое къде отива.


от REPLAY (252 точки)


0
За name напиши valign="top". Пример Name:. А за Last Action го направих така : Last Action Never been locked Link to public post

от SNeykov (176 точки)

0
Е да де ама нали целта е да го накараме с CSS да се качи горе. Мисля, че вече не е удачно да използвам тези стилистични атрибути в основният html документ.

от REPLAY (252 точки)



0

Ето докъде съм стигнал, та въпроса ми е следният, как да разбера на оригиналната снимка от сайта какъв шрифт има текста? Както се вижда моя шрифт е друг, по-точно дифолтен шрифт от браузъра.


от peter (559 точки)


0
колега, пишеш в body { font-family: sans-serif; } и нещата заспиват.

от Viktor_Ivanov (2505 точки)

0
Стана, но все пак ме интересува по какво се разбира какъв шрифт да ползвам? На лекцията нищо не казаха за шрифтовете освен, че съществува такова нещо.

от peter (559 точки)



0
Колеги, аз имам един много странен проблем. Като си направих задачата всичко си беше хубавко и шаренко, но след няколко пъти оптимизиране веднъж натиснах няколко пъти F5 и взеха че ми изчезнаха цветовете на CSS стиловете. Шрифтовете, които съм задала, тяхната големина и цвета на фона си стоят, ама цвета който съм задавала на текста изчезна. Рестартирах и сега се появяват само когато решат. Пробвах и на друг компютър - там не се появяват въобще.... Аз ли правя нещо много грешно? Някой има ли някаква идея какво може да е то? Правила съм задачата с таблица, в кода всичко изглежда наред и преди работеше както си трябва.... Help :)

от kate_master (0 точки)


0
може да имаш някъде синтактична грешка в css файла. Например, някои кавички, скобки, точка е запетайка или нещо от сорта да е пропуснато или пък да не е на място.

от Viktor_Ivanov (2505 точки)

0
Ами търсих и нищо не открих. Работата е там че файла работеше и после поак същия фай вече нещеше да работи. Нищо непроменяно по него, ама нищичко не бях пипала и както работеше така спря.... Знам че обикновено е предклавиатурен проблем, просто това е малко странно....

от kate_master (0 точки)