CSS writing skillz

Ugyan nem CSS-ezek, de ez tetszett.

Írásmód 1:

#wrapper {
    width:800px; 
    margin:0 auto;
}

#header {
    height:100px; 
    position:relative;
}

#feature .post {
    width:490px;
    float:left;
}

Írásmód 2:

#wrapper            {width:800px; margin:0 auto;}
#header             {height:100px; position:relative;}
#feature .post      {width:490px; float:left;}

Nekem sokkal szimpatikusabb és áttekinthetőbb, különösen hosszabb listában.

35 hozzászólás

tillmannr

Ha csak olvasod, valóban jobb a második, de én mindig az első írásmódot választom, írás kozben az az áttekinthetőbb szerintem.
Ez a CSS comperssor dolog tetszik, majd kipróbálom.

lix

dehat jozsi ezt minden eppeszu ember igyirja aki nem azt meg vigye el a kanko

Andris

Ha már több selectort írunk a tulajdonságok elé, akkor a második írásmód már nem lesz olyan szép oszlopossá rendezett, mert elcsúszik oldalra. Mindig az első írásmódot használom.

Zila

A második módszert használom, de ugye egy picit is tisztességes css editor (nálam ez egy eclipse plugin) segít a tulajdonságok elérésében (eclipse Outline panelén ott vannak a szabályok egymás alá kibontható tulajdonságokkal, rendezéssel, tulajdonságon kattintva az editorban gyakran hosszú szabály definícióban kijelöli a megfelelő részt…)

csi

Ha 3-4 tulajdonságnál több van a blokkban akkor már nem szép, túl hosszú a sor.

ati

a második ilyen

.klassz {tulajdonság1:érték1; tulajdonság2:érték2;}

esetben jó, több tulajdonságnál meg a horizontális szkroll igen nagy pain-in-the-ass-tényező…

suexID

Mondjuk próbáld meg, hogy megadsz egy baszott nagy, 3 könyvtárnyi mélységben leledző képet background url-ben, meg adsz még mellé egy kis háttérszínt, meg margókat és máris nem leszel képes végigolvasni.

Az első írásmód előnye, hogy létezik az a megfizethető kategóriájú monitor, amire egyben kifér mondjuk egy 8-10 soros CSS definíció is, áttekinthetően.

nemeseri

En is mindig az elso variaciot hasznalom, kollegakkal megy mindig a flame hogy melyik a jobb. A masodik verzio akkor hasznalhato, ha sok rovid szabalyt adsz meg, kulonben egy nagy tomorseg lesz.

Mac-en egyebkent a CSS Edit nevu progi zsenialis CSS szerkesztesre. Az egyik leg coolabb cucc..

b.

well, én definíciónként keverem a .css fájlban… ha kifér egy sor, ha nem több…

greg

én magamtól is a második írásmódot preferálom, de mivel hobbiból faragok css-t mobilra, ezért még egy saját php classon is áttekerem az output-ot hogy még kompaktabb legyen a kimenet, nagy ívben szarva az olvashatóságra.

zolle

kívánom minden kedves plastik olvasónak, aki a második fajta írásmódot preferálja, hogy 2-3 év múlva újra bele kelljen írni a kódjukba.
kellemes szopást!

Highlander

Első. a második tipo buzulás sztem, élesben ritka, h csak 2-3 tulajdonsága legyen vminek.
Ha meg vki tényleg a helyet sajnálja, akkor szedjen ki minden sortörést és space-t a css-ből.. 🙂
Sztem.
De ha már itt tartunk, arra ki szokott figyelni, hogy egy-egy css file mérete ne lépje túl a 4094 byte méretet? (nna az az igazi elvkultság, nem az h ki hogy rendezgeti sorait :))

Zila

zolle: Nap mint nap bele kell nyúljak a kódba. Ha nem eclipse-szel csinálnám, nyilván szopnék, így viszont csak kacagok, pláne, hogy ha nagyon akarom, akkor van autoformat ami az első írásmódra formáz, hol élsz te a középkorban? Notepad meg vi? 🙂

XYBeR

többen használnak valamilyen vi-származékot, mint hinnéd. van, ahol nincs gui, fél giga memória, java, meg türelem az eclipse (jó esetben) sétáltatására

zolle

Zila, y. Notepad, meg vi. Tudod, iWebbel összetolni egy weblapot nem pálya 😀

egyébként azért, mert így tanultam, még Pascalban, majdnem 10 éve.. és nem voltak hülye emberek a prog tanáraim, sőt! bár programozni nem tudok, de úgy gondolkodni igen. nagyon sokat segít.

TBS

AD, egy rendes alkotó rendes editorával a 2. egy klikkre előhozható az elsőből. Sőt. Fejlesztéskor szép indentálás, produkciós állapot meg minimalizált whiteszpészekkel…

Nincs furmány, s királyi út.

Hogy született ez a post..? 1000000 éve nem láttam tőled ilyet… C64 és a jelen között cikázol mentálisan..?

anvee

Az első egy komolyabb CSS esetén több ezer soros állományt eredményez, a második hosszú sorokat. A másodikat meg lehet oldani wrappal a legegtöbb editorban, ezért ezt használom.

Mefi

Én általában a kettőspontokat húzom egymás alá, elég hasznos dolog, mikor módosítani kell.

Parci

a második írásmód komolyabb esetekben játék. mi keverve használjuk egyébként, de vérzenek is jórészt a css-eink. az elsőben van a ráció.

mr. m.

több éve majd mindennap CSS-t írok (kézzel, nem editorral) a második írásmód használhatatlan a gyakorlatban…

suexID

Zila: SciTE-ot használok CSS és HTML kódolásra. Egyébként merek fogadni egy 6-os minipack sörben veled, hogy hamarabb lekódolom amit akarok cross-browser kompatibilisre, mint a mindenféle kattintgatós szarokkal.

zolle: tökéletesen egyetértek, ott a pont.

angelday: a kézi kódolásban az a jó, hogy ha ebből élsz, ezt csinálod évek óta, akkor sokkal jobban kézreáll, mint ezek az editoros cuccok. Pl. évekig szívtam dreamweaverrel, meg annak a beépített CSS szerkesztőjével, mert féltem kipróbálni a másik módszert. Aztán egyszer úgy döntöttem, hogy váltok. Elhagytam a dw-t, teljes kézi kódolás, és negyedannyi idő alatt megvagyok dolgokkal.

alpi

Kézi +1
Első verzió +1
Krekkölt Textpadot használok de attérnék ha ajánlana valaki egy rendes freeware win editort amiben van reguláris kifejezéses keresés/csere funkció. (Grep vagy más editoron kívüli megoldás nem játszik.)

Haszprus

na izé ha a firefoxban pl. szeretnéd on-the-fly (!) szerkeszteni és megjeleníteni a lapokon a css-t (kurva hasznos), akkor nem sok más választásod van mint a kézi kódolgatás, mégpedig pontosan abban a formátumú kódban, amit te vagy akármilyen editor létrehozott. itt a félkm hosszú sorok használhatatlanok, amellett hogy nem árt ha nem csak legördülő menükből kened a css-t 🙂

bjmatt

DW + első megoldás + webdev toolbar. DW: jó az autocomplete benne és a snippetek, ennyi.

_Nec

ad1: fejlesztéskor a vízszintes scroll, ahogy ati is említette, minden esetben pain-in-the-ass kategória, mindegy milyen nyelvről van szó

ad2: legtöbb editor nemcsak property-value párosokat ajánl fel szerkesztésre, hanem van egy outliner (eclipse alapú IDE-kben igy hívják) ami csak a leírt css selectorokat listázza, abc vagy valós sorrendben, ott kattintva máris a jó helyen vagy

ad2: probáld meg a második verziót áttuszkolni egy verziókövető rendszerben, aztán feloldani a conflictokat később

alpi: Eclipse + Aptana… majdnem tökéletes páros

Harder

Valós munka esetében az elsőt tartom olvashatóbbnak/kezelhetőbbnek, de legtöbbször vegyítem a kettőt. pl. ilyen esetekben:

#minta1, #minta2, #minta3, #minta4, #minta5 {
valami1: ertek1;
valami2: ertek2;
valami3: ertek3;
valami4: ertek4;
}
#minta1 { color: red; }
#minta2 { color: blue; }
#minta3 { color: yellow; }
#minta4 { color: black; }
#minta5 { color: white; }

A 2. megoldást tisztán már csak akkor használnám, ha a kód kész és tudom, hogy egyhamar nem kell belenyúlnom (kisebb a fájlméret). Ha mégis dolgoznom kell vele többet, akkor pedig hasznos funkció a pspad “HTML/reformat into structured CSS” illetve “HTML/reformat into inline CSS” funkciója, amivel ezt a 2 formázást ide-oda lehet váltogatni.