- Yettel topik
- iPhone topik
- Apple iPhone 14 Pro Max - sziget fesztivál
- Android alkalmazások - szoftver kibeszélő topik
- Realme GT 5G - versenyképes
- Honor Magic5 Pro - kamerák bűvöletében
- Samsung Galaxy A54 - türelemjáték
- Redmi Note 12 Pro - nem tolták túl
- A Watch7-tel debütálhat a Samsung vércukormérője
- Xiaomi 13 - felnőni nehéz
Hirdetés
-
Toyota Corolla Touring Sport 2.0 teszt és az autóipar
lo Némi autóipari kitekintés után egy középkategóriás autót mutatok be, ami az észszerűség műhelyében készül.
-
Igencsak szerény méretekkel rendelkezik az Aetina Xe HPG architektúrás VGA-ja
ph Az 50 wattos modellt beágyazott rendszerekbe, MI-vel kapcsolatos munkafolyamatokhoz és edge applikációkhoz szánták.
-
A Video AI lehet a One UI 6.1.1 ütőkártyája
ma Vagy hogy fogja a mesterséges intelligencia manipulálni a mozgóképeket?
Új hozzászólás Aktív témák
-
honda 1993
senior tag
válasz martonx #1298 üzenetére
Engem nem igazan erdekel a reszponziv webdizajn ( legalabbis egyenlore meg nem)
Ugyanis szerintem sokkal jobb az egyszeru desktop nezet, bar lehet hogy ez csak szerintem van igy.
Nyilvan ha majd szugsegem lesz ra akkor majd utananezek.Sk8erPeter "Ikszdé!
Látom megtetszett. " Van ez igy.[ Szerkesztve ]
XD alias IKSZDé
-
Sk8erPeter
nagyúr
válasz honda 1993 #1301 üzenetére
"ha majd
szugsegemlesz ra"
Nem adom fel, addig foglak javítgatni, amíg legalább ezt az egy szót meg nem tanulod. Legalább nemcsak webfejlesztéssel próbálkozol, hanem egy kicsit a magyar nyelv tanulgatásával is, rádfér.
Tehát: szükség. Vágod? Szükség. SZÜKSÉG!!!!444NÉGYNÉGY!! K-val! KÁVAL!Na, mindjárt jön a "nincs jobb dolgod"-duma...
Amúgy hogy ON is legyek, ez az "Engem nem igazan erdekel a reszponziv webdizajn [...] Ugyanis szerintem sokkal jobb az egyszeru desktop nezet" nem túl profi hozzáállás.
Nem tudom, neked mekkora tégla lehet a telefonod, de azért sok oldalt kényelmetlen nézni a teljes nézetben egy átlagos okostelón (ilyen 4" az már egész átlagosnak számít), pl. a PH-t is rázoomolva kell nézni a desktop-nézetben, és ide-oda scrollozgatni az oldalon.Sk8erPeter
-
#81999360
törölt tag
válasz Sk8erPeter #1303 üzenetére
Nem tudom, hogy miért van erre szügség. Mindig belekötni szegénybe...
On: (#1301) honda 1993:
Az hogy egyelőre (mellesleg az sem egyenlőre, hanem egyelőre) nincs rá szükséged, nem jelenti azt hogy nem kellene megtanulni. Webes témában szerintem jó, ha mindenről van némi fogalmad.[ Szerkesztve ]
-
PumpkinSeed
addikt
válasz Sk8erPeter #1303 üzenetére
Igazából nekem az idő során teljesen ráállt az ujjam a PH mobilon való nagyítás scrollozás stb-re.
Amúgy az miért van, hogy a böngésző összehúzásakor megy a reszponzív design meg tök jól néz ki, de mobilon iPhone 4S, pedig az eredeti nézet jelenik meg. Most ezt így kód nélküli konklúzióként vontam le eddigi "alkotásaimat" nézve.
"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
-
Zedz
addikt
válasz Sk8erPeter #1303 üzenetére
Kezdem azt hinni, hogy lassan összehaverkodtok!
-
martonx
veterán
válasz honda 1993 #1301 üzenetére
Majd amikor észreveszed, hogy az oldalad minimum 20%-ban (és egyre növekvő százalékban) mobilról néznék, majd gyorsan érdekelni fog.
Sőt akkor az olcsó tabletekről még nem is beszéltünk az 1024X600-as felbontásukkal.Én kérek elnézést!
-
honda 1993
senior tag
válasz martonx #1307 üzenetére
Mondjuk ebben van valami.
És egyébként csak hogy tudjam.
Ha mégis hozzáfognék, akkor ez kb mekkora meló lenne úgy hogy 0-ról kezdeném el tanulni.Tehát az lenne a kérdésem egy kicsit pontosítva, hogy az egész oldalam át kellene írnom, vagy valamivel egyszerűbb lenne?
XD alias IKSZDé
-
DNReNTi
őstag
válasz honda 1993 #1308 üzenetére
Szerintem egyelőre ne fogj hozzá. Egyébként optimális esetben jóformán csak a CSS-t kell átírni, tehát nem nagy meló.
but without you, my life is incomplete, my days are absolutely gray
-
honda 1993
senior tag
válasz Sk8erPeter #1303 üzenetére
Jólvan, már annyiszor mondtad hogy nem jól írom ezt a bizonyos szót hogy már megjegyeztem.
Szóval mostmár nincs szügségem arra hogy kijavíts.
Nyugi csak vicc volt ha esetleg nem esett volna le.
DNReNTI : Miért emelted ki azt hogy optimális esetben?
Esetleg előfordulhat hogy a HTML kód is bekavar?[ Szerkesztve ]
XD alias IKSZDé
-
DNReNTi
őstag
válasz honda 1993 #1310 üzenetére
"Esetleg előfordulhat hogy a HTML kód is bekavar?"
Naná. Optimális eset alatt azt értem, hogy a HTML a modern szabványoknak megfelelő, letisztult, olvasmányos ésszerűen felépített kód, nem pedig egy toldott-foldott, valami 8 éves editorral összekattintgatott táblázatos layout, tele inline formázással.but without you, my life is incomplete, my days are absolutely gray
-
Zedz
addikt
válasz honda 1993 #1310 üzenetére
Optimális esetben már alapból úgy építed fel az oldal HTML kódját, hogy ne okozzon gondot az esetleges mobil CSS hozzá adása. Amúgy nem olyan elvetemülten nehéz szerintem, csak pepecselős meló. Nézz utána a media queryknek. Ezzel a módszerrel több felbontásnak megfelelő CSS-t is tudsz készíteni.
-
adam_
senior tag
Sziasztok! Van egy #wrapper id-val ellátott div rész a honlapon, a header fölött. Ezen található bal oldalt egy logó, mellette egy szöveg, és jobb oldal vízszintesen a menüsor. Így néz ki htmlben:
<div id="wrapper">
<div id="wrapperLogo">
<img src="img/lion.jpg" width="150" height="100" alt=""/> </div>
<h2> Lion Tour </h2>
<nav>
<ul>
<li><a href="#">About Us</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Guest</a></li>
<li><a href="#">Price</a></li>
<li><a href="#">Tour</a></li>
<li><a href="#">Home</a></li>
</ul>
</nav>
</div>és vizuálisan pedig így: [link]
Hogyan tudnám a logó mellette szöveget a logó mellé középre hozni? Próbáltam paddinggelni h2-re, viszont akkor a menübart is viszi lefelé. Hogyan oldhatnám meg, hogy csak a szöveg mozogjon a megfelelő helyre?
Előre is köszönöm a segítségeteket!
-
DNReNTi
őstag
válasz PumpkinSeed #1315 üzenetére
"<div id="clear"></div>"
Wat?Egy: nincs definiálva a CSS-ben, kettő: mér' id? A clearfix legyen már osztály, ha már ebben a formában használjuk. Meg amúgy is: ne az img tag kapjon már globális float-ot, főleg, hogy még konténer is van neki. És végül: az egész elintézhető ennyivel: display: inline-block;
but without you, my life is incomplete, my days are absolutely gray
-
adam_
senior tag
válasz PumpkinSeed #1315 üzenetére
Köszönöm, így már jó!
Az miért van, hogy html-ben megírom menüfunkcióként a listámat, style formázás után mégis fordítva jeleníti meg a benne található elemeket. Gondolok itt arra pl, hogy a "Home" menü lenne az első, de valamiért azt teszi legutoljára, és a "Contact" fület pedig az első helyre.
Valamint még egy "technikai észrevétel". A DW CC-ben az élő nézetben valamikor teljesen más mutat a honlap megjelenítésnek, mint amit chrome vagy mozillában látok. Ezért is már csak mentést követően ezekbe a böngészőkbe nézem az oldal megjelenését. A "Live-nézet" DW-ben egyszerűen rossz lenne?
[ Szerkesztve ]
-
DNReNTi
őstag
Jaaa, lol.
Float helyett:
A li tag-ek legyenek display: inline;
A bennük lévő a tag pedig: display: block;Így nem kell floatot és clearfixet használni, ráadásul szépen középre is lehet rendezni a csapatot, mivel a lista elemek inline lesznek.
but without you, my life is incomplete, my days are absolutely gray
-
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
-
adam_
senior tag
A tartalmi résznél kép a két hasáb között valamiért nem teszi fehérré a lapot, gondolom a body osztály színbeállításait nézi. Itt a kód a content részhez:
<div class="content" id="leftContent">
<h4> Tour in Africa </h4>
<img src="img/leftSideImg.jpg" height="200" alt=""/>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. </p>
</div>
<div class="content" id="rightContent">
<h4>Lion Safari</h4>
<img src="img/africa-animal-cat-1066.jpg" height="200" alt=""/>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
</div>Itt a hozzá tartozó CSS:
.content {
background-color:#FFF;
}
#leftContent {
float:left;
text-indent:25px;
text-align:justify;
font-size:15px;
width:48%;
border-left:solid 1px #A6A6A6;
}
#leftContent img {
float:left;
padding-right:5px;
padding-left:5px;
}
#rightContent {
float:right;
text-indent:25px;
font-size:15px;
text-align:justify;
width:48%;
border-right:solid 1px #A6A6A6;
}
#rightContent img {
float:right;
padding-right:5px;
padding-left:5px;
}
.content h4 {
color: #ec8000;
text-weight:bold;
text-align:center;
}Ha egyszerűen a content részt teszem fehérré, akkor se teszi egyszerre a left és a right side-ot fehérré, mindig közte marad a kis rés, ami a body osztály színbeállításait nézi. Hogyan tudnám a két sideot egységesen fehér háttérrel ellátni?
[ Szerkesztve ]
-
DNReNTi
őstag
"Hogyan tudnám a két sideot egységesen fehér háttérrel ellátni?"
Igazából már elláttad. Mind a kettő tökéletesen fehér, de mivel 48% szélesek, így 4% az oldalszélességből "kimarad" és ott az alatta lévő objektum látszik. Ez most valszeg a body, ahogy te is gondoltad. Megoldás az lehet, ha ezeket belehelyezed egy 100% széles fehér hátterű konténerbe.but without you, my life is incomplete, my days are absolutely gray
-
-
adam_
senior tag
válasz DNReNTi #1327 üzenetére
<div id="side1">
<div class="content" id="leftContent">
<h4> Tour in Africa </h4>
<img src="img/leftSideImg.jpg" height="200" alt=""/>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. </p>
</div>
<div class="content" id="rightContent">
<h4>Lion Safari</h4>
<img src="img/africa-animal-cat-1066.jpg" height="200" alt=""/>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
</div>
</div>Csináltam egy side1 divet, ami felöleli a tartalmakat, és ezt a side1 ID-s divnek css-ben megadtam a width:100%-os értéket és fehér szint, viszont továbbra is közte van az a pici szürke rés.
[ Szerkesztve ]
-
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
-
DNReNTi
őstag
válasz Sk8erPeter #1332 üzenetére
Logikus az tény, de ha valaki ragaszkodik a listless megoldáshoz, lehet inline-block az a tag, akkor pedig megkapja a blokkelemek áldásos tulajdonságait, így például, hogy lehet adott szélessége. Így akkor megint felesleges a lista. Mondom ezt elkötelezett lista-menü felhasználóként.
Szerk:
(#1331) Sspot
Már akartam szólni, mert untam bemásolgatni.Ennek folyományaképp:
(#1330) adam_
JsFiddle?Szerk:
Na jó nem b*ziskodok, de legközelebb tényleg használd a fiddle-t. Csak tippelni tudok, mivel a tartalmi div-ek floatolva vannak, és nincs clearfix, így az az eredmény, az egészet magába ölelő konténer (#side1) 0px magas, tehát mintha egy üres div lenne.[ Szerkesztve ]
but without you, my life is incomplete, my days are absolutely gray
-
Zedz
addikt
válasz Sk8erPeter #1332 üzenetére
Köszönöm a terjedelmes választ, így már látom a logikát a lista mögött. De ha már felvetődött a téma akkor szeretném kicsit boncolgatni, csak hogy minden világos legyen. Írtad, hogy szükségünk van block szintű elemekre, például a teljes menü szélességének megadásakor. Ezért az ul, ol teljesen megfelel számunkra. De a nav is block szintű elem, annak is lehet szélességet adni, és pl nav#menu a -ként bármit rá lehet húzni magára az a elemre is. Vagy így az egészet rosszul gondolom?
-
Sk8erPeter
nagyúr
válasz DNReNTi #1333 üzenetére
Szerintem meg ez erőltetett, mert így inline elemet átvariálsz inline-block-ká, minek, ha van rá megfelelő elem, meg ha így logikus (plusz a normálisan strukturált felépítést szerintem a keresőrobotok is értékelik, bár szerencsére sosem kellett mélyen tanulmányoznom a SEO-irományokat). Mindegy, mindenki úgy csinálja, ahogy akarja.
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
-
DNReNTi
őstag
válasz Sk8erPeter #1335 üzenetére
Én értem, de ettől még szerintem a megoldás - annak ellenére, hogy én se így használom - nem rossz, annak ellenére sem, hogy egy inline elemet váltok inline-block-ká. Ha fordítva nézzük, akkor meg egy block elemből (li) csinálok inline-t. Na mindegy, folytathatnánk szerintem ezt reggelig, igazad van: mindenki úgy csinálja, ahogy akarja.
Szerk:
Na jó még egy dolgot csak hozzáteszek:
Egy sima egy szintű menünél ráadásul mind a HTML mind a CSS kód rövidebb.[ Szerkesztve ]
but without you, my life is incomplete, my days are absolutely gray
-
DNReNTi
őstag
Csekkold most. Két hiba is volt. Egyet írtam korábban is igaz nem neked, definiálatlan a clearfix, a másik, hogy a clearfix-et ebben a formában a konténeren belülre, a floatolt elemek után közvetlenül kell betenni.
but without you, my life is incomplete, my days are absolutely gray
-
Zedz
addikt
válasz Sk8erPeter #1336 üzenetére
Nem az <a> tagre gondoltam, hanem a <nav>-ra. Írtad, hogy például menü szélesség megadásához kellett <ol>, <ul>, de mivel a <nav> is block szintű, ezért nem értem, hogy miért tartsam meg a listát. Mert ha a szokásos menü design-t szeretném elérni - tehát az egymás mellett lévő menüpontok -, akkor több dolgom van a lista gatyába rázásába, mintha csak simán adnék egy paddinget a <nav> <a> elemeire. Például itt.
-
DNReNTi
őstag
Furcsa állatfaj, az első néhány alkalommal, az tuti. Ezért is jobb csak ott float-ot használni, ahol muszáj. Itt nem lenne muszáj. Szintén szóba került ma már párszor a display: inline-block; használata. Esetedben is megspórolt volna némi kínlódást.
Szerk:
(#1343) Zedz
Éppen ezt írtam itt.[ Szerkesztve ]
but without you, my life is incomplete, my days are absolutely gray
-
adam_
senior tag
válasz DNReNTi #1344 üzenetére
Valamint még egy "technikai észrevétel". A DW CC-ben az élő nézetben valamikor teljesen más mutat (pl header szélességnek) a honlap megjelenítésnek, mint amit chrome vagy mozillában látok. Ezért is már csak mentést követően ezekbe a böngészőkbe nézem az oldal megjelenését. A "Live-nézet" DW-ben egyszerűen néha bugos lenne?
[ Szerkesztve ]
-
Zedz
addikt
Nem használok DW-t, de így elsőre valami olyasmit tippelnék, hogy szimplán máshogy alapján építi fel a weboldalt. Ez tetten érhető a böngészők között is, tehát például megadsz XY értéket egy elemnek, az mondjuk Chromeban tökéletesen fog kinézni, Explorerben pedig már szét van csúszva az egész. Más motor, máshogy épít.
[ Szerkesztve ]
-
Sk8erPeter
nagyúr
Igazából Zedz mondta ki a kulcsszót, valószínű, hogy arról van szó, hogy böngészőmotorbeli eltérések vannak - az 5.5-nél már WebKitet használtak, de lehet, hogy nem követték már a Blink-vonalra való átállást... bár az általad írt drasztikus változások tényleg furcsák, ennyire azért nem kéne durvának lennie az eltérésnek, hogy még a szélességek sem stimmelnek. Sajnos pont emiatt nem alkalmas ez az eszköz sem arra, hogy a komplett frontendet ebben tervezd meg. (Ne kérdezd, mi alkalmas rá, nem tudok ilyenről a kézi bűvészkedésen, mindenféle böngészőben való tesztelésen kívül.)
Sk8erPeter
-
DNReNTi
őstag
válasz Sk8erPeter #1348 üzenetére
"azért nem kéne durvának lennie az eltérésnek, hogy még a szélességek sem stimmelnek"
Tudom sarkos, de simán lehet ha box-sizing fix-et használ, és azt a Dw figyelmen kívül hagyja, így mondjuk az 500 px szélességhez a live view hozzáadja a paddingot, a böngészők meg nem. Így el tudom képzelni, más esetben elég para. Egyébként meg egyetértek.Szerk: elírás
[ Szerkesztve ]
but without you, my life is incomplete, my days are absolutely gray
-
adam_
senior tag
Egy Youtube videót szeretnék beágyazni az oldalalom, JSFiddle szépen meg is jeleníti a kódot, de ha élesbe beszúrom a honlap kódjába, akkor ott nem hoz be semmit, csak egy üres részt, "szürke színnel, ami a háttér színe". Próbáltam esetleg clear beszúrással is, de úgy sem jó. Itt a kódrészlet: [link] Hozzáteszi még, hogy" a fájlt, vagy könyvtárt nem sikerült megtalálni" egy kis ablakban az éles nézetben.
A régi hosszú "object" kódos youtube beágyazással sem jó.
[ Szerkesztve ]