14
мар 10

Как форматирате вашия CSS код?

Преди няколко дни за пореден път прочетох тази статия и реших, че може някой от вас да се посмее със следващите редове или пък да се замисли, какво и как пише ...

Писането на CSS код според мен е изкуство. Виждал съм какъв ли не CSS и смея да твърдя, че има много хора които не знаят на какъв език пишат. Но Нека започнем от там:

Какво точно означава CSS (Cascading Style Sheets) ?

Пишейки тези редове реших да погледна какво казва wikipedia по този въпрос ?

И ето нейният отговор :

Cascading Style Sheets (CSS) is a style sheet language used to describe the presentation semantics (that is, the look and formatting) of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML, but the language can be applied to any kind of XML document, including SVG and XUL.

Написано е чудесно нали ? Виж цялата публикация »

тагове: ,
6
мар 10

Unicode Characters за имена на CSS класове

Звучи странно нали ?
Преди време бях чел нещо подобно, но не му обърнах достатъчно внимание докъто снощи не попадна отново на Mr.Snook (на когото съм почитател от доста време). Чесно казано се зарадвах когато помислих върху предимствата на това :) . За да не ви отекчавам ще премина направо към кода.

Да вземем например следната ситуация :

Имаме следния HTML

<div class="♫">ACDC - Thunderstruck</div>
<div class="♫">Metallica - Enter Sandman</div>
<div class="♫">Manowar - Warriors of the World</div>
<div class="♫">Pantera - Walk</div>
<div class="♫">Megadeth - Symphony of destruction</div>

CSS кода ни може да изглежа така :

.♫ {
	hieght:24px;
	background: #ffffff;
	border:1px solid #ccc;
	color:#639ace;
	font-size:11px;
	line-height:23px;
}

Виж цялата публикация »

4
мар 10

Как да презапишем инлайн зададени стилове с "Style Sheet"

Написан от мен сайт на HTML и CSS, на който съм описал всички нужни елементи, като например : <p></p>,<span></span>,<a href=""></a>, <h1><h1>, <h2></h2> и т.н. бива поддържан от човекът "X".

Нека приемем, че оригиналният код изглежда така :

HTML :

<p class="normal_text">dummy text "1"</p>
<p class="normal_text">dummy text "2"</p>
<p class="normal_text">dummy text "3"</p>
<p class="normal_text">dummy text "4"</p>
<p class="normal_text">dummy text "5"</p>

CSS :

.normal_text {
	color:#777;
	font-size:11px
	font-weight:400;
	padding:0 0 10px;
}

Виж цялата публикация »

тагове: , , , , , , , , ,
2
мар 10

Block vs. Inline Elements

Когато ми се е налагало да обяснявам на някого за едните и другите, а именно Блоковите и Инлайн елементите, почти винаги съм срещал трудности и за това от няколко дни отделям по няколко минути на ден да напиша този пост и мисля че вече събрах нужната информация за тези елементи :)

Block Element - Блоковия Елемент

  • Винаги започва на нов ред
  • Може да манипулирате - height, line-height, top margin и bottom margin
  • По подразбиране ширината му е 100% от неговия "parent" елемент, "child" елемент, освен ако не му е зададена ширина

Примерни блок елементи са: <div>, <p>, <h1> - <h6>, <form>, <ul>, <li> и други.

Виж цялата публикация »

2
мар 10

Замисляли ли сте се, че писането на HTML може да бъде смешно?

Може би хората като мен често се смеят или по-правилно е мисля да кажем че роним сълзи от радост четейки HTML код писан преди години от нас самите или от колеги ...

но има и друга смешна страна на това начинание :) надявам се да ви хареса

Виж цялата публикация »

тагове: , ,
2
мар 10

Календар на лошата ползваемост :)

преди 2 години попаднах на този календар и много се смях ... днес пак се сетих за него и го потърсих ... воаля :) ето го и него.

2007 - http://www.iallenkelhet.no/bad-usability-calendar-2007-er-her

2008 - http://badusability.com/

тагове: , , ,
1
мар 10

Как да си направим табове "Tabs" с помоща на CSS & jQuery

Дали за удобство, дали за красота или просто защото някой иска да покаже какво може :) използването на табовете е доста разпространено напоследък. В този урок ще се опитам да ви покажа един от най лесните начини за направата на такива табове с няколко реда CSS, xHTML и малко JavaScript. Надявам се този урок да полезен не само за начинаещи, но и за напреднали.

Стъпка 1 - HTML и CSS

Първото нещо, което ще направим е да създадем HTML документ с име "index.htm". За този урок ще използваме тип на документа XHTML 1.0 Transitional. Ще използваме директория "css" от която ще заредим css файл с име "style.css", както и директория "js", от която ще заредим jQuery библиотеката "jquery-1.4.min.js" и файл с име "scripts.js" в който напишем няколко реда код, които ще ни помогнат за създаването да табовете. Виж цялата публикация »

23
фев 10

Компресиране на CSS с PHP

Ако използвания от вас CSS код е голям като размер това води до забавяне на скороста с която се отваря вашият сайт. Съществуват много компресори които могата да намалят размера на вашия CSS файл премахвайки празни редове коментари и др. но това е доста неудобно имайки в предвид че когато се налага да правите промени файлът ви няма да е лесно четим. Виж цялата публикация »

тагове: , ,
23
фев 10

Разлики между Уеб Дизайнер, Front-end Разработчик и Уеб Програмист

Много често изразите "Уеб Дизайнер" и "Уеб Програмист" се използват, като две взаимозаменяеми думи. Може би за клиента е без значение или пък за неговата секретарка, но всъщност е важно да се знае разликата между двете думи. Много често може да намерите хора, които са неквалифицирани, неопитни, или просто не са много добри в едната или другата сфера(Уеб Дизайнът или Уеб Програмирането) и се опитват да си проправят път чрез проект, който изисква както творчески, така и технически умения. Ето защо много недобре планирани уеб-базирани проекти се провалят. По-голямата част от вината обикновено може да се дължи на факта, че не много хора действително не разбират каква е разликата между "Уеб Дизайнер" и "Уеб Програмист".

Може би най-ефективният начин да се прави разлика между двете позиции е да се създаде ясна линия, която разделя ролите и отговорностите на всяка позиция в контекста на Web-базиран проект. Това разбира се за всеки проект е различно, както и от екипа който ще работи по него, но можем да определим една разумна граница в която уеб дизайнера и уеб програмиста ще се чувстват удобно.

Какво точно е Уеб Дизайнер?

Най-добрите уеб дизайнери са от творчески тип. Те имат умението да разбират клиентите си и да реализират идеите и вижданията и представите им. Те използват тези идеи и представи и умело ги превръщат в един естетичен, художествен дизайн, който цели да впечатли милиони потенциални зрители. Освен художествените похвати не по-малко важни са и типографията, потребителския интерфейс и ползваемостта.  Уеб Дизайнерите използват инструменти, като : Adobe Photoshop, Fireworks, Illustrator.

Това е в общи линии, макар често да се спори, че ролята на дизайнера освен да нарисува въпросният сайт трябва също и да нареже изображенията, да напише xHTML-а, CSS кода и др., но по-често се срещат уеб дизайнер-и които са творчески личности. Виж цялата публикация »

16
фев 10

Отваряне на връзка(линк) в нов прозорец

Има хора, които са големи привърженици на отварянето на връзки(линкове) в нов прозорец.
Проблема идва когато решим да използваме "xHTML Strict", и при изплзването на target="_blank" валидатора гърми с грешка (Attribute "target" exists, but can not be used for this element.) Виж цялата публикация »

тагове: ,

« по-стари