Css a lógó vonalakkal és szünetekkel dolgozom
W jelentése lógó vonalak és szünetek
A lógó karakterlánc a bekezdés vagy a cím végén egy szót ír le.
Az ilyen szavak akkor jelennek meg, ha a sor utolsó mondata egy újhoz ugrik, mert nem illeszkedik a szélességhez.
Sokkal jobb, ha legalább két szó van az utolsó sorban. Az emberek gyakran nem akarnak egyetlen szót sem hagyni a vonalon. Az ügynökség, amellyel dolgozott, megközelítette ezt a kérdést olyan pedáns módon, hogy rögeszmés vágyam volt újra megvizsgálni nem annyira a szöveget, mint a szalagcímeket a felfüggesztési vonalak hiányában.
Az alábbiakban néhány tippet adtam a függővonalak eltávolításához és a vonalszakaszok kezeléséhez.
Ne próbálja meg használni a br tételt, hogy kényszerítsen egy sortörést
HTML-címke használatával kényszeríthetjük a sortörést és áthelyezhetjük a szöveget egy új sorra.
Gyakorlati kurzus az adaptív leszállásról a semmiből!
Tanuljon meg a semmiből, hogy adaptálódjon a HTML5 és CSS3 alkalmazásokhoz a következő 6 napban
Nagyméretű képernyőkön ez a fejléc szépnek tűnhet, de ha kinyitod az oldalt egy kis képernyőn, akkor a vonalszakadás kellemetlen helyen lehet, ami elrontja a fejlécet. Például:
Ez akkor történhet, ha a vonal szélessége elegendő csak a "Ez egy hosszú cím, amely". A "kell" szó tehát egy új vonalra ugrik, amely után egy kényszeres szünetet fognak felállítani, ami egy újabb sorba "egy új sorba ebbe a helyre" lépne. Nem túl kellemes.
Ne használja a br-címkét behúzóként
Nagyon gyakran látom, hogyan csinálják a diákok. Csak megtanulják használni a HTML-t, és néhány elemet el akarnak távolítani egymástól. Adjon további párnázatot a fejlécek tetején, nagyobb helyet a szakaszok vagy bekezdések között stb.
A br tagek használatával üres sorokat adhat hozzá, amelyek helyettesítik a behúzókat, de a behúzást mindig a CSS-ben kell beállítani. A margin tulajdonság sokkal több lehetőséget kínál, mint br. A HTML tartalma, nem pedig stílusok.
Mikor használhatom a br tageket?
Ez ellentmond a kijelentésnek, hogy nem használhatsz vonalszakaszt a stílusokhoz? Talán.
A sor törlése a kijelzővel: nincs
A br tag láthatatlan (csak a sztringet fordítja le). Nem rendelkezik vizuális jellemzőkkel: nem látható, nincs mérete, alakja, színe vagy bármi más.
De hozzáadhat egy osztályt a sortöréshez, hogy szabályozhassa a fordítást egy új sorra a megjelenítési tulajdonság használatával.
Ha beállítja a kijelzőt: nincs, a vonalbontás megszűnik. És ha a kijelzőt: blokkot állítja be, egy szünet jelenik meg. Néha hasznos lehet párosítani a média lekérdezésekkel, hogy bizonyos képernyőkön hozzáfűzzön és eltávolítson vonalszakadást.
A fenti kód eltávolítja a szöveget a kis képernyőkön, és nagy képernyőkön megjelenik a rés, és a szerzői jog szövegét két sorba építik fel.
használat a felfüggesztett vonalak rugalmas eltávolításához
Térjünk vissza oda, ahol elkezdtük ezt a cikket. Ha egy címke használatával kényszerít egy sortörést
lehetetlen, akkor mi lehetséges?
Egy rugalmasabb módszer az, ha két szót egy szünet nélkül egyesít. Akkor a szöveg szép lesz. Vegyük az alábbi jelölést:
A "sztring" és az "itt" szavak között megkülönböztethetetlen hézagot adtam hozzá, mert két szó egyformán viselkedik.
Ha a képernyő széles, a fejléc egy vonalra illeszkedik, és minden jól néz ki.
Ha a képernyő szélessége csökken, akkor a legközelebbi töréspont az "új" szó és a "string here" szövegrész között lesz. Ez azt jelenti, hogy ha nincs elég hely, egy sortörés kerül beillesztésre, ami az utolsó két szót áthelyezi a második sorra. Nincs lógó vonal, minden jól néz ki.
Meg akarja próbálni ezt a technikát? Nyissa meg a böngésző fejlesztői paneljét, és ellenőrizze az oldal fejlécét. Csökkentheti az ablak szélességét, és megnézheti, hogyan viselkednek a szavak az egyes fejlécekben.
Kiadás: A webformyself parancs.
Gyakorlati kurzus az adaptív leszállásról a semmiből!
Tanuljon meg a semmiből, hogy adaptálódjon a HTML5 és CSS3 alkalmazásokhoz a következő 6 napban
A legfrissebb hírek az informatikai és webfejlesztésről a Telegram csatornán