Új hozzászólás Aktív témák
-
fordfairlane
veterán
Ezt tedd hozzá a CSS-hez:
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;Buttonoknál (input type button, submit, button tag) alapból box-sizing: content-box van beállítva a böngészőkben, ne kérdezd miért, valami legacy dolog.
x gon' give it to ya
-
kemkriszt98
aktív tag
-
kemkriszt98
aktív tag
Nem ! De most nem is az a lényeg hanem az elrendezés...
DNReNTi:
Eddig én is megoldottam... most jönne az a rész, hogy ha háttérszínt állítok akkor ne látszódjon köztük hely meg hogy a hátterek kitöltsék az oldal szélességét..."Tigris, tigris, csóvafény éjszakáknak erdején, mily kéz adta teneked szörnyü és szép termeted?" -William Blake-
-
Sk8erPeter
nagyúr
Szerinted ha egy függőlegesen tartott, 3 m hosszú léccel be akarsz menni egy 2 m magas ajtón, akkor a léc alkalmazkodni fog az ajtó méretéhez? Csak azért mondtam ezt a példát, hogy érezd, hogy a fix méretekkel kb. mit tudsz kezdeni. Vágod, a pixel az egy képpont, 400 képpont az 400 képpont, és kész. Nem alkalmazkodik az semmihez.
(#1070) Jim-Y :
Neked meg itt válaszoltam, nem nagyon reagáltál.Sk8erPeter
-
martonx
veterán
-
DNReNTi
őstag
A kérdés teljesen jogos, mivel a nav tag-nek nem kötelező listát tartalmaznia, tehát tökéletesen jó megoldás lenne az is ha így használnánk:
<nav>
<a href="#">Menü 1</a>
<a href="#">Menü 2</a>
...
</nav>Magam részéről én még csak nem is gondolkoztam ezen. Szvsz elsőrorban beidegződés, mint a float, használja mindenki ha kell ha nem. A menü végül is egy lista, ráadásul (szintén szvsz) olvasmányosabb is listaként a kód. De ha mondjuk többszintű menük készítesz, akkor a fenti példa már elvérzik, be kell vezetni új osztályokat, akkor meg már minek vezetnéd be ha ott a jó öreg lista. Plusz: lehet vele ügyeskedni, ahogy a korábbi példámban írtam. Igaz, egy sima menü esetében eleve elkerülhető ez az ügyeskedés ha a fenti példát használod.
but without you, my life is incomplete, my days are absolutely gray
-
-
Sk8erPeter
nagyúr
"Amúgy miért listával csináljátok a menüket a nav tagen belül? Akkor nem kell ilyenekkel szórakozni, a böngésző is tudja már, hogy ez bizony egy menü. "
Az <a> tag - gondolom erre az alternatív megoldásra gondoltál, hogy csak ezeket használod list-itemek helyett - egy inline (szövegközi) tag, tehát alapértelmezetten csak olyan stílusok érvényesek rá, mint a többi inline-szintűre... hiába adsz meg neki mondjuk 300px szélességet, ha az csak az általa kitöltött helyet "foglalja" (pl. 100px-nyit). Egy menü elemeinek meghatározásához pedig a legtöbbször valamilyen - legalább minimális - szélességet meg szeretnél határozni.
Ezért tehát blokkszintű elemekre van szükséged. Például ilyen az unordered vagy ordered list (<ul>, <ol>). A menüelemek egyenként pedig szemantikailag pont megfelelnek egy lista egy-egy elemének (hiszen a menüpontok felsorolása is egy lista), ezért értelemszerűen az a jó, ha azt a taget használod a definiálásukra, amivel éppen listaelemeket határozol meg (<li>).
Lehetnek alternatív megoldások, de ez a logikus.
Nyilván nem véletlen, hogy a népszerű template-ek, front-end keretrendszerek, mint pl. a Bootstrap is a <nav>-on belüli <ul>-t használják menükészítésre.(#1328) Zedz:
"Először még listáztam én is, de nav óta már nem használom"
Akkor szokj vissza a használatára.(#1325) DNReNTi:
Nem csak "beidegződés", hanem van logika a használatában, lásd fentebb.[ Szerkesztve ]
Sk8erPeter
-
Sk8erPeter
nagyúr
Ha blokkszintűvé varázsolod az <a> taget, akkor annak is adhatsz blokkszintű stílusformázást, csak mondom, szerintem ez kicsit erőltetett megoldás, valaminek "álcázni" egy elemet. Persze nyilván van, amikor az alapértelmezett stílust pont, hogy felül kell bírálni, bizonyos elemeket floatolni vagy inline-ná tenni, épp azért, hogy a megfelelő módon jelenjenek meg, ne az alapértelmezett módon (mint ahogy pont a listaelemeket is egymás mellé kell úsztatnod floattal), de ebben az esetben szerintem jobb eleve a jó megközelítést alkalmazni.
De hát ízlések és pofonok különböznek.Sk8erPeter
-
Jim-Y
veterán
Én enterprise környezetben egy hybrid html5 mobile appon dolgozom, de nem tartom magam frontendesnek, mert pl a HTML - hoz és a CSS - hoz csak nagyon alap szinten ertek, szóval magamat inkább web developernek nevezném. Mielőtt még valaki beszolna hogy az npm nem is build tool, azért írtam mert kisebb projekteknel az npm is simán lehet a build tool.
-
DNReNTi
őstag
Mindkettő, és egyik sem. Én még nem határoltam el magam egyik oldalra sem, pedig el kéne, mert amíg mind a kettőt hajtom egyikben sem leszek kiemelkedő. Nem rég kaptam egy ajánlatot frontend pozícióba, talán egy picit közelebb is áll hozzám mint a szerver oldal. Ennek ellenére érdekel az is mi folyik a háttérben, így szívesen foglalkozok azzal is.
(#1394) Zedz
A JQuery pár éve istenkirályság volt, azóta viszont van HTML5 és CSS3, egy csomó alap dolog amire korábban JQ-t használtunk, már elérhető a használata nélkül, azok a dolgok pedig amikhez még mindig szükség van JS-re, az megoldható simán JS-el, feleslges overhead a JQ-t használni. Persze ezt nem lehet általánosítani, hasznos kis lib, de már közel sem annyira mint korábban.LESS vagy SASS/SCSS?
Szerintem a LESS egyszerűbb, könnyebb vele kezdeni, viszont épp ezért kicsit korlátoltabb is. Az SCSS nekem jobban kézre áll, sokkal áttekinthetőbb, kiforrottabb, saját függvényeket (akár rekurzív, vagy feltételhez kötött) írhatok, változókat használhatok, ésatöbbi. Ezzel még ugyan ráérsz, de ha majd ott tartasz, én a SASS/SCSS-t javaslom, aztán hogy majd neked akkor melyik áll a kezedre eldöntöd, sok különbség amúgy nincs.but without you, my life is incomplete, my days are absolutely gray
-
martonx
veterán
A PHP egy típustalan script nyelv. Ezzel mindent elmondtam. Ettől persze még lehetne benne komoly dolgokat is csinálni, csak sokkal több macera.
Ráadásul mint típustalan script nyelv, szinte hívogat a gányolásra, elvégre emberek vagyunk, és mindenki szeret elfolyni a kisebb ellenállás irányába. Azaz pistike projektekhez sokkal egyszerűbb PHP-t használni. Viszont a projektek bonyolódásával elkezd visszájára fordulni a folyamat, és egy bizonyos szint felett már kb. csak szenvedés PHP-zni. Hogy hol van ez az inflexiós pont, az persze egyén függő.Az egyetlen kivétel a Facebook. De az is csak arra példa, hogy korlátlan tőkével a hátad mögött bármit megtehetsz, akár szarból is tudsz egész komoly várat építeni. Ráadásul FB esetében a PHP inkább mint csak a C fordító script nyelveként funkcionál, és kb. nulla köze van a tényleges PHP-záshoz.
Egyébként ha már script nyelv, akkor nekem a Python egészen bejön.
Én kérek elnézést!
-
martonx
veterán
Félreértés ne essék, én nem akarok az ASP.NET mellett pálcát törni, csak éppen a PHP ellen, és egy jó alternatíva például az ASP.Net, de itt a "például"-on van a hangsúly.
Egyébként "hello world" szinten szerintem semmi előnyét nem fogod látni, sőt azt fogod érezni, hogy bakker ezt egy 10 soros php file-al is meg tudnám csinálni.
Aztán amikor végigszenvedted magad életed első több fejlesztős, több emberhónapos projektjén PHP-ban, majd utána egy hasonlót megcsinálsz például ASP.NET-ben is, na akkor érezni fogod, hogy miről beszélünk.Mindenesetre egészen váratlan módon itt találsz hozzá anyagokat, egészen jó get startedeket, meg egy adag oktató videót is: www.asp.net Van hozzá, egészen naprakész (hehe, már amennyire bármilyen dokumentáció naprakész lehet) magyar nyelvű ingyenes e-book is link
Én kérek elnézést!
-
honda 1993
senior tag
Akkor megerositetted azt amit gondoltam, mert en is ugy hiszem hogy a meg megmaradt par regebbi tipusu monitor miatt nem fogom atvarialni ( hiszen azokon is rendesen mukodik) csak az egesz monitort kitolti maga a tartalom.
Es ezekbol a monitorokbol ugyan nem tudom hogy mennyi lehet meg hasznalatban, de az biztos hogy az ido mulasaval egyre kevesebb lesz beloluk.Koszi
[ Szerkesztve ]
XD alias IKSZDé
-
adam_
senior tag
Köszi, elmagyaráznád nekem, hogy itt a fentebb linkelt oldalon pl. miért van számomra "furcsán" a span theo osztályában a WORK kijelentés? Az adott oldalon még több helyen találkozok hasonló megoldással. Ez miért is van így, miért van szótagolva a szó és így beillesztve az osztályba?
<div class="caplabels">
<div class=" singlecolumncap">
W
<span class="theo">O</span>
RK
</div>
<div class=" singlecolumndescription"> Branding, Identity, Packaging, Illustration </div>
</div> -
DNReNTi
őstag
Szerintem nincs vele semmi probléma, gondolom valami arculati megfelelés az oka, ha megnézed az osztály negatív jobb és bal margót állít be az elemre (azaz az O betűre), így az közelebb kerül a szomszédaihoz. Más okot nem tudok elképzelni.
but without you, my life is incomplete, my days are absolutely gray
-
DNReNTi
őstag
Gondolom pont az a cél.
(#1495) adam_
Kiegészíteném picit amit Zedz írt.
A blokk (block) szintű elem tulajdonságai:
- Mint ő is írta, előtte után sortörés van, ha ezt nem definiálod felül. (float)
- Ha nincs definiálva szélesség, kitölti a rendelkezésére álló teret. (Azaz a szülő elem szélességét)
- Ha nincs definiálva magasság, akkor a benne lévő elemek magasságáig terjed ki. (Ezért van, hogy pl egy üres <div> nem látszik, mivel a magassága nulla.)
- Definiálhatóak margin és padding attribútumok minden irányban. (Érdemes használni a box-sizing: border-box; fixet, megkönnyíti a matekot.)A sorszintű (inline) elemek tulajdonságai:
- Nem okoz sortörést, marad a "szöveg"környezetben. (Azért tettem "" jelbe, mert pl az img tag is inline)
- Csak jobb és bal margin definiálható.
- Nem akarok hülyeséget mondani, azt hiszem padding minden irányban alkalmazható.
- Nem definiálható magassága és szélessége.Így hirtelen ennyi.
but without you, my life is incomplete, my days are absolutely gray
-
adam_
senior tag
DNReNTi, Zedz
Ehhez a kódhoz lenne két kérdésem. Élesben valamiért a .title a:link {
text-decoration: none; } tulajdonság hatására sajnos ha ráviszem az egeret az "Adam" title-re, még aláhúzza, viszont most így beillesztve JSFiddleben meg nem az adott linket. Mi lehet a gond amiért JSben működik, de amúgy meg nem?!Valamint hogyan tudnám pontosan egy sorba hozni a címet és a menüt? Hiába adok a .title-re padding avagy margin-top: 10-20px-elt nem viszi egy sorban a menüvel.
[ Szerkesztve ]
-
fordfairlane
veterán
Rákattintottam a linkre, kiválasztottam a webfont kit fület, a subsetet hungarianra állítottm, és letöltötem a zipet. A zip-et kicsomagolva a teljes opensans készlet benne van, én csak a light-ot próbáltam. Generál egy példa html-t, ebbe belenyúltam, hogy legyen benne őŐűŰ, és nekem így oké Firefoxban, Chorme-ban és IE-ben is. Legközelebb linkeld légyszi a Google webfontot, hogy ne kelljen ennyit szöszmötölni a teszteléssel.
x gon' give it to ya
-
fordfairlane
veterán
A Google-t nem kell letölteni, egyébként ennyi az egész:
Itt becsekkolod a "Latin Extended (latin-ext)" opciót, és alul a hivatkozásban egyből látszik is.
<link href='http://fonts.googleapis.com/css?family=Open+Sans&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
x gon' give it to ya
-
martonx
veterán
Ezzel mondjuk vitatkoznék. Pont a minimalista oldalaknál nincs szükség bootstrapre elvégre ha minimalista, akkor nincs is mit használni belőle. És pont a komplex cuccoknál jöhet jól a benne lévő kismillió okosság.
Ettől függetlenül nem vagyok nagy barátja a frameworköknek, szvsz a legjobb ezek használatát minden esetben a minimálisra szorítani, és saját, direkt a célra optimalizált változatokkal kiváltani.
Én kérek elnézést!
-
Sk8erPeter
nagyúr
Azért ez attól is függ, hogy van-e már kész sablon arra a bizonyos webshopra vagy sem, ha 0-ról kezdik írni, akkor a "nem sok mindent lehetne onnan hasznosítani" nem igaz, kapásból kézhez kapsz egy komplett gyűjteményt a reszponzivitás és még rengeteg más kialakításához, valami alapvető stílussal való felruházásához, persze aztán még erre ráépülhet az egyedi dizájn.
Ez sem fekete vagy fehér (szóval nem csak az van, hogy egyszerű oldalhoz oké, komplexhez nem oké), sztem a Bootstrapet vagy más hasonló frameworkszerűséget simán lehet kiindulási alapnak használni egy komplexebb oldalhoz is, szóval elég hasznos tud lenni, ha ismer ilyet.Szerk.: martonx megelőzött, közben ő is írt neked választ.
(#1562) martonx:
Egyetértek, tényleg nagyon jó a doksija a Bootstrapnek.(#1563) martonx:
Szerintem minimalista oldalra is jól lehet használni. A minimalista oldalt is simán lehet, hogy valaki mobilon is jól olvashatóvá akarja tenni, de nem akar tökölni az alap kézzel való megírásával. Mondjuk számolni kell azzal, hogy a Bootstrap saját fájlocskáit is be kell töltögetni.[ Szerkesztve ]
Sk8erPeter
-
DNReNTi
őstag
-
Sk8erPeter
nagyúr
Nem tudom, szerintem ez már a felesleges agyalás kategória. Kategorikusan nem érdemes kijelenteni, hogy erre érdemes, erre nem, úgyis a helyzet dönti el; na meg lehet tömörítve is átküldeni ezeket a fájlokat a hálózaton, lehet CDN-t használni, meg ott van a böngésző gyorsítótára (így többszöri látogatáskor gyorsítótártörlésig vagy fájlmódosulásig csak egyszer kell letöltenie a felhasználónak), meg aztán lehet, hogy a minimális letöltendő méret elérése a cél, de lehet, hogy az a 100 KB már pont nem számít, blablablabla, mindig attól függ.
Azzal sem értek egyet, amit DNReNTi írt, hogy "ágyúval verébre"-kategória lenne, minimalista oldalnál is megérheti a kapott szolgáltatások miatt (pl. reszponzivitás, amit nem kell megint megírni, de persze biztos van minimalistább stylesheet is).
De mindenki el tudja dönteni, hogy adott helyzetben megéri-e kézzel összerakni a stíluslapokat, vagy felhasználja azt a munkát, amit már más elvégzett helyette.==================================
(#1569) adam_:
Szerintem az ilyen pénzbe kerülő plecsnik helyett sokkal jobban megéri inkább referenciákat gyűjteni (akár haveroknak/családtagoknak/ismerős cégének/akárkinek fejlesztett, igényesebb honlap fejlesztése is jobb lehet; meg ha valamilyen papírról van szó, ami számíthat, akkor az inkább már egyetemi/főiskolai szakirányú képzettség), a munkáltatót az többnyire sokkal jobban érdekli.[ Szerkesztve ]
Sk8erPeter
-
PumpkinSeed
addikt
""Fogalmam sincs csak feltettem a kérdésem hátha segít valaki. Amúgy azt se tudom hogy hová tartozik!" - 2014"
Lehet én is keresek egy ilyen csodálatos idézetet most már, nehogy kilógjak a sorból.[ Szerkesztve ]
"Akinek elég bátorsága és türelme van ahhoz, hogy egész életében a sötétségbe nézzen, elsőként fogja meglátni benne a fény felvillanását." - Kán
-
honda 1993
senior tag
Alap példa kódot kértem arra, hogyan igazítod középre, nem az egész weboldalt.
Tudom ,ertettem csak az a baj hogy sokaig tartana mire a forraskodot ugy modositom hogy csak egy alap forraskod maradjon belole. Tenyleg eleg hosszadalmas lenne, lehet hogy hamarabb jonnek ra magamtol a problemara mint hogy a forraskodot elkuldom.
Minden esetre koszonom a segitseget neked is es DNReNTI nek is.
[ Szerkesztve ]
XD alias IKSZDé
-
honda 1993
senior tag
En most csinaltam valamit, es ugy tunik hogy mukodik de kozben szinte biztos vagyok benne hogy az egesz ugy szar ahogy van
a head reszbe ezt irtam : <link rel="stylesheet" type="text/css" href="responzive.css" media="screen and (max-width: 500px)">
Mig a "responzive.css" fajlba mindent osszezsugoritottam annyira, hogy mobiltelefonos meretben is hasznalhatobb legyen.
Ezzel azt ertem el, hogy ha a bongeszo ablak merete kisebb lesz mint 500px; akkor lep ervenybe a "responzive.css" fajl.Tudom hogy nagyon nehezen lesz ertelmezheto az utobbi szoveg, de sajnos mivel nagyon kezdo vagyok a temat tekintve ( responzive design), nem igazan tudom megfogalmazni ugy ahogy kellene.
A kerdes csak az lenne, hogy mennyire van kozel a valos megoldashoz az amit itt most osszeganyoltam?
Igazabol csak megneztem egy par perces youtube tutorialt es utana probalkoztam vele.XD alias IKSZDé
-
honda 1993
senior tag
Megnezem majd a media-query-t is, de ha azt mondjatok hogy az a megoldas amit en alkalmaztam szinten elfogadhato, akkor lehet hogy egyelore igy hagyom....
Bar mondjuk en mar lattam olyan responzive oldalt ahol folyamatosan zsugorodott es rendezodott az oldal tartalma , a bongeszo ablak meretenek csokkentesevel.
Az enyem nem ilyen, de ha ezt is lehet majd hasznalni telefonrol akkor vegul is en elegedett leszek.. ( mas kerdes hogy az oldal latogatoi mit szolnak majd hozza.)Viszont ez az elso olyan dolog css-ben, amire valoban ugy jottem ra hogy hasznaltam a fejemet egy kicsit... Lehet hogy gyakrabban ki kellene probalnom?
szerk: van valami ami viszont nem az igazi, megpedig a " body".
Ugyanis ez tovabbra is olyan szeles mint a sima style.css fajlban, es nem tudom hogy mit kellene beleirni ahoz hogy olyan szeles legyen mint acontainerakarom mondani : page.Probalkoztam azzal hogy width: 500 px; de ez nem jo..
otlete van valakinek?
[ Szerkesztve ]
XD alias IKSZDé
-
honda 1993
senior tag
Na de úgy ahogy pl ha HTML-ben létrehozok egy divet és utána tudok csak a css segítségével annak a divnek tulajdonságokat adni ,gondoltam hogy a media query is hasonlóan működik.
Nem kell semmilyen külön link sem a html kódba?
mint pl a <link rel="stylesheet" type="text/css" href="style.css">
XD alias IKSZDé