Ablakok.  Vírusok.  Jegyzetfüzetek.  Internet.  hivatal.  Segédprogramok.  Drivers

…Bár a HTML szintaxisa viszonylag egyszerűen megtanulható, még mindig sok olyan elem, attribútum és… egyéb fogalom van, amelyeket meg kell tanulnia és nyomon kell követnie. hogy megismerje a HTML lényegét, ez… tényleg nem úgy van kialakítva, hogy megtanítsa az összes elérhető elemet és attribútumot.…Ezt szem előtt tartva szeretnék néhány online HTML-forrást átadni, amelyek valóban segíthetnek elkezdi tanulni a HTML-t, és…a későbbiekben értékes hivatkozásokként szolgálhat, amikor saját oldalait készíti.…Most kezdjük magával a specifikációkkal…

És ez valami, két dokumentum, amelyet mindenképpen meg kell jelölnie a könyvjelzővel.…Szóval, ez a HTML5 W3Cs verziója.…Láthatja, hogy a legújabb Publisher Verziójuk van. látni akarom, mi jön le a csövön.…És ez elég nagy.…Ha lefelé görgetek, tudsz nézd meg, hogy itt "csak a tartalomjegyzék"...És nem is fogom végiggörgetni az összeset...

Az átirat automatikus görgetésének folytatása

Frissítve
3/30/2017
Megjelent
3/16/2015

A HTML a programozási nyelv, amely hatalmat gyakorol a háló. És mint minden nyelv, amint elsajátította, elkezdheti saját tartalom létrehozását, legyen szó egyszerű webhelyekről vagy összetett webalkalmazásokról. Ez a kurzus alapos áttekintést nyújt a lényegről: a HTML szintaxisáról és a bevált módszerekről A vezető munkatárs, James Williamson áttekinti egy tipikus HTML-dokumentum szerkezetét, és bemutatja, hogyan lehet oldalakat szekciózni és HTML.Plus-szal formázni a tartalmat, megtanulja, hogyan hozhat létre hivatkozásokat és listákat, és hogyan működik együtt a HTML a CSS-sel és a JavaScripttel a gazdag tartalom létrehozásához. , megnyerő felhasználói élmények.

A témák a következők:

  • Miért fontos a HTML?
  • HTML dokumentum felfedezése
  • Tartalom formázása
  • Képek megjelenítése
  • Nav, article és div elemek használata
  • Oldalakra és letölthető tartalmakra mutató hivatkozások
  • Listák készítése
  • A stílus szabályozása (betűtípusok, színek és egyebek)
  • Alapvető forgatókönyvek írása

Ph.D. Lavlinsky N. E., a Method Lab LLC műszaki igazgatója

A közelmúltban megjelent az előtöltési technológia új szabványa (link). Ennek a specifikációnak a fő célja az volt, hogy lehetővé tegye a fejlesztő számára az oldalerőforrás-betöltési logika finom vezérlését.

Korábbi szabványok

A terheléskezelés ötlete nem új. Korábban számos címkelehetőséget fejlesztettek ki link attribútumokkal alforrás, előrenderelésÉs előhívni. Ezek azonban egy kicsit másképp működtek: segítségükkel olyan oldalelemeket vagy teljes oldalakat tölthet le, amelyekre szükség lehet az oldalon való további navigáció során. Vagyis a böngésző alacsony prioritással és utolsóként küldte az ilyen kéréseket. Ha növelni kell a prioritást, akkor nem volt megoldás.

Erőforrások betöltése előtöltéssel

Mi az új specifikáció? Először is, most a betöltés a betöltendő adatok specifikációjával történik. A megadott erőforrástípus alapján a böngésző beállítja a letöltési prioritást. Például:

link rel="preload" href="/js/script.js" as="script">
link rel="preload" href="/fonts/1.woff2" as="font" type="font/woff2" crossorigin>

Másodszor, az erőforrás típusa ( mint) lehetővé teszi a böngésző számára, hogy a megfelelő fejléceket küldje el, hogy a szerver tartalmat küldhessen a legjobb lehetőség tömörítés (például WebP-képek küldése, ha a böngésző támogatja őket).

A második példában egy betűtípusfájlt töltünk be, amely egy adott formátumot (WOFF2) határoz meg, amelyet nem minden böngésző támogat. Mindaddig azonban, amíg az előtöltési mechanizmus támogatása megegyezik ennek a formátumnak a támogatásával, nincs probléma. A jelenlegi mechanizmus támogatás megtekinthető.

Gyorsabb betűtípus betöltés

A webhely előtöltéssel történő felgyorsítására példa a mélyen eltemetett erőforrások, például a betűtípusok betöltése. A normál letöltési folyamat során a böngészőnek először le kell töltenie a betűtípusra mutató CSS-fájlt, elemeznie kell a fájlt, és csak ezután kell sorba állítania a betűtípusfájl letöltésére vonatkozó kérést.

Ha ezt a betűtípust előre betöltjük a HTML oldal kódjába, akkor a böngésző azonnal elküldi a kérést a HTML dokumentum elemzése után, ami néhány másodperccel korábban is előfordulhat, mint normál esetben. És tudjuk, hogy a csatlakoztatható betűtípusok blokkolják az elemeket, és késleltetik a betűtípus megjelenítését az oldalon, ezért a lehető leggyorsabban be kell tölteni őket. Ez a probléma különösen akut HTTP / 2 használatakor, amikor a böngésző egyszerre több kérést küld a szervernek, aminek következtében egyes képek kitölthetik a kliens sávszélességét, és a fontos erőforrások betöltése késik.

Aszinkron CSS betöltés

A CSS-fájlok mindig blokkolják az oldalmegjelenítést, így minden késleltetett CSS-erőforrás normál fájlként betölthető, és dinamikusan összekapcsolható az oldallal.

Ez a következőképpen történik:

link rel = "preload" as= "style" href = "async_style.css" onload = "this.rel="stylesheet"" >

JS-kód betöltése végrehajtás nélkül

Hasznos lehet az is, ha előre betölti a szkript kódját JS-ben, hogy később végre lehessen hajtani.

Ezt a következő kóddal lehet megtenni:

link rel="preload" as="script" href="async_script.js"onload= "varscript = document.createElement("script"); script.src = this.href; document.body.appendChild(script);">

Áttekintettük az előtöltési mechanizmus használatának főbb módjait, de a lehetőségek nem korlátozódnak erre, végezzen saját kísérleteket!

A ResourceBundle.Control osztály külső metódusokkal rendelkezik, amelyeket a ResourceBundle.getBundle() metódus hív meg a kötegek keresésekor és betöltésekor. Miután létrehozta a Control osztályt, módosíthatja az alapértelmezett betöltési és gyorsítótárazási viselkedést.

BAN BEN ez az eset létre kell hoznia a Control osztály két metódusának megvalósítását: getFormats() és newBundle() . A getFormats() metódus felelős az XML formátum fenntartásáért, míg a newBundle() az erőforráskötegen működik. Az alap Control osztály segédmetódusokkal rendelkezik az alapkészletnevek tényleges erőforrásnevekké való konvertálására.

A ResourceBundle.Control osztály ezen megvalósítása az XMLResourceBundle alosztályát tartalmazza. Ez az alosztály az adatok betöltésére szolgál XML fájlés használja őket a ResourceBundle metódusban.

Az alábbiakban a Control osztály leírása és a ResourceBundle metódus megvalósítása olvasható:

import java.io.*;
import java.net.*;
import java.util.*;

Az XMLResourceBundleControl nyilvános osztály kiterjeszti a ResourceBundle.Control(
private static String XML = "xml" ;

Nyilvános lista getFormats(String baseName ) (
return Collections.singletonList(XML) ;
}

Public ResourceBundle newBundle( String baseName, Locale locale,
Karakterlánc formátum, ClassLoader betöltő,
logikai újratöltés)
dobások IllegalAccessException, InstantiationException, IOException{
if ((alapnév == null ) || (helyszín == null ) || (formátum == null )
|| (betöltő == null )) (
dob új NullPointerException();
}
ResourceBundle köteg = null ;
if (format.equals(XML))(
String bundleName = toBundleName(alapnév, területi beállítás) ;
String erőforrásnév = erőforrásnév
(bundleName, formátum ) ;
url= loader.getResource
(erőforrásNév) ;
if (url != null ) (
URLConnection kapcsolat = url.openConnection() ;
if (kapcsolat != null ) (
ha (újratöltés) (
connection.setUseCaches(false) ;
}
InputStream stream = connection.getInputStream() ;
if (folyam != null ) (
BufferedInputStream bis = new BufferedInputStream(
folyam);
bundle = new XMLResourceBundle(bis) ;
bis.close();
}
}
}
}
visszatérő köteg;
}

Az XMLResourceBundle privát statikus osztály kiterjeszti a ResourceBundle(
Private Properties kellékek;

Az XMLResourceBundle(InputStream folyam) IOException(
props = new Properties();
props.loadFromXML(stream) ;
}

Protected Object handleGetObject (karakterlánc kulcs) (
return props.getProperty(key) ;
}

Nyilvános felsorolás getKeys()(
A handleKeys = props.stringPropertyNames beállítása() ;
vissza Gyűjtemények felsorolása (handleKeys );
}
}

Nyilvános statikus void main(String args ) (
("Test2" ,
új XMLResourceBundleControl()) ;
String string = bundle.getString
("HelpKey" ) ;
System.out.println ("HelpKey: " + string ) ;
}
}

Ez a megvalósítás egy háromsoros tesztprogramot tartalmaz:

ResourceBundle bundle = ResourceBundle.getBundle("Test2", új XMLResourceBundleControl()) ;
String string = bundle.getString
("HelpKey" ) ;
System.out.println ("HelpKey: " + string ) ;

A legérdekesebb itt az első sor. A vezérlést át kell adnia a getBundle() metódusnak. Ezt követően a készletet ugyanúgy használhatja, mint bármely más esetben.

A következő fordítás XML példa Test2.xml fájl:

http://java.sun.com/dtd/properties.dtd" > rendben Megszünteti Segítség Igen nem

Az XMLResourceBundleControl program végrehajtásának eredménye a következő lesz:

> java XMLResourceBundleControl HelpKey: Súgó

A fenti megvalósítás nem használja a getTimeToLive() és a needsReload() metódusokat:

nyilvános long getTimeToLive( String baseName, Locale locale)

public logikai needsReload( String baseName,
locale,
karakterlánc formátum,
osztályú rakodógép,
erőforrás csomag,
hosszú betöltési idő)

A getTimeToLive() metódus visszaadja a ResourceBundle.Control segítségével létrehozott erőforráscsomagok élettartamát. Az erőforráskészletek gyorsítótárban vannak az újratöltési folyamat felgyorsítása érdekében. Így egy készlet újratöltésekor az a gyorsítótárban lesz. A pozitív élettartam érték ezredmásodpercben megadja, hogy a készlet mennyi ideig maradjon a gyorsítótárban újraellenőrzés nélkül. A getTimeToLive() metódus által visszaadott alapértelmezett érték a TTL_NO_EXPIRATION_CONTROL , amely letiltja a gyorsítótár lejáratának ellenőrzését. Ha nem szeretné gyorsítótárba helyezni a készletet, adja vissza a TTL_DONT_CACHE értéket. Ha a visszatérési érték 0, akkor a köteg gyorsítótárban van, de minden alkalommal ellenőrzi a getBundle() metódus meghívásakor. A gyorsítótár törléséhez hívja meg a ResourceBundle osztály statikus clearCache() metódusát. Van egy opcionális ClassLoader argumentuma, amely lehetővé teszi egy adott betöltő által létrehozott gyorsítótárak törlését.

A needsReload() metódus határozza meg, hogy a gyorsítótárazott készletet újra kell-e tölteni. igaz azt jelenti, hogy a készletet újra kell tölteni, a false pedig azt, hogy nem kell újratölteni. A needsReload() metódus túlterhelésével szabályozhatja, hogy egy erőforráskészletet újra kell-e tölteni. Ha például azt szeretné, hogy az erőforráskészlet mindig újratöltődjön, a needsReload() metódusnak mindig true értéket kell visszaadnia. Ebben az esetben a getTimeToLive() metódusnak mindig 0 értéket kell visszaadnia. Ellenkező esetben a halmaz a vártnál tovább fog fennmaradni.

Megszerzéséért további információ A Mustang nemzetközivé válási folyamataival kapcsolatos fejlesztésekkel kapcsolatos információkért tekintse meg John Okoner, a Sun Software Developer blogját a következő címen:

Úgy döntöttem, hogy folytatom ezt az aktuális témát. listát készítettem a legjobb források a html és a css megtanulásához, hogy segítsen az érdeklődőknek ezeknek a kérdéseknek a tanulásában. Emlékszem, amikor magam is webmesterként kezdtem, nagyon hiányzott a minőségi és hasznos források ilyen választéka.

Először is néhány definíció:

A HTML (az angol "HyperText Markup Language" szóból - hiperszöveg jelölőnyelv) a weboldalak szabványos jelölőnyelve.

A Css (az angol "Cascading Style Sheets" szóból - lépcsőzetes stíluslapok) egy leírási technológia kinézet weboldalak.

A html és a css ismerete nélkül a webhely futtatása nagyon problémás lesz - még a statisztikai számláló vagy ugyanaz a banner sem fog működni. Ne szaladjon a szakértőkhöz segítségért, vagy ne hozzon létre témát téma után a fórumokon? Csak venni kell és tanulni kell.

Saját tapasztalatból azt tudom mondani, hogy a html és a css 1 hónap alatt megtanulható. Természetesen nem a szakmai magasságokról beszélek – te magad is eljutsz hozzájuk, ha akarod.

Szerintem, A legjobb mód A html, css és egyéb témák elsajátítása, beleértve a webhely-promóciót, saját webhely létrehozása és gyakorlása. Mellesleg az első általam készített oldalt a térképeken láthatjátok a Counter-Strike játékhoz, amit akkoriban szívesen készítettem. Íme a térképek és a hozzájuk tartozó képernyőképek, amelyeket a régi Globator készített azokban az időkben, amikor még nem tudta, mi a top 10, a TCI és a PR, és hanyagul hancúrozott a napon háromdimenziós térképeket készítve 🙂. Ezt az oldalt egy hónap alatt hoztam létre, a gyakorlatban tanultam a html-t és a css-t.

A html és a css megtanulásához nem szükséges az technikai specialista. Én például általában humanista vagyok, és matematikából alapvetően "2" volt 🙂 . Így bárki megtanulhatja a html-t és a css-t. Az általam felsorolt ​​források arra is alkalmasak, hogy html és css segítségével bármikor megtudhassák az Önt érdeklő pillanatokat.

Weboldalak html és css tanuláshoz

Elindítok egy válogatást a html és a css tanulásához szükséges hasznos forrásokból egy általam tanulmányozott webhelyről. Ezeket a Wild html leckéket Valentina Akhmetzyanova aka Wild írta. Olyan vidáman és érdekesen leírta az összes szükséges pontot, hogy a html és css tanulása a leckék segítségével izgalmas élménnyé válik. Egyébként a blog oldalát olvashatod. Vad leckék elegendőek ahhoz, hogy a webmesteri munkához szükséges szinten elsajátítsák a html-t és a css-t.

El tudod képzelni, ki lennék, ha tovább fejlődnék a Photoshop témában? Igazi szörnyeteg lennék! De itt felvettem a kapcsolatot a SEO-val és a vegetációval, hidegtől csavart ujjakkal gépelve ezeket a betűket 🙂 . Csak viccelek, itt is meleg van és jók az ételek 🙂.

Minden HTML hivatkozások külsőre és belsőre osztva. A külső hivatkozások olyan hivatkozások, amelyek egyik webhelyről egy másik webhelyre vagy egy másik webhelyen található fájlra vezetnek. Belső linkek- ezek olyan hivatkozások, amelyek a webhely egyik oldaláról ugyanannak a webhelynek egy másik oldalára vagy ugyanazon oldal szakaszaira hivatkoznak.

Minden külső hivatkozás a címke href attribútumában tartalmazzák az általuk hivatkozott dokumentum abszolút elérési útját. A belső hivatkozások viszont tartalmazhatnak abszolút és relatív útvonalat is (ebben az esetben ez az Ön személyes preferenciáitól függ).

Minden hivatkozás feltételesen felosztható relatívra és abszolútra. Relatív linkek A relatív útvonalakat tartalmazó HTML hivatkozások, a relatív hivatkozások csak belsőek lehetnek. Abszolút linkek Abszolút útvonalakat tartalmazó hivatkozások, az abszolút hivatkozások lehetnek külsőek és belsők is.

Relatív út

Relatív út azt jelenti, hogy a webhely kívánt fájljának vagy oldalának elérési útja ahhoz a könyvtárhoz képest kezdődik, amelyben a hivatkozást tartalmazó oldal található, vagy a webhely gyökérkönyvtárához viszonyítva. Tekintsük azokat a részeket, amelyekből egy relatív útvonal állhat:

Az út részei Leírás Értékpéldák
fájl név Ha csak a fájlnevet adja meg attribútumértékként, ez azt jelenti, hogy a szükséges fájl ugyanabban a mappában található, mint a hivatkozást tartalmazó oldal. "oldal.html"
katalógus/ Ha az a fájl, amelynek az elérési útját meg kell adni, egy gyermekkönyvtárban található a hivatkozással rendelkező fájlhoz képest, ez azt jelenti, hogy egy szinttel lejjebb kell mennünk (az aktuális könyvtár gyermekmappájához), ebben az esetben a Az elérési út a gyermekkönyvtár nevével kezdődik, utána a nevet egy "/" perjel jelöli, az elérési út részeinek elválasztására szolgál, utána a szükséges fájl neve kerül feltüntetésre.

Megjegyzés: Csak annyi mappába léphet le, ahány mappát létrehozta. Például, ha létrehozott egy mappát 10 szinttel a gyökér alatt, megadhat egy elérési utat, amely 10 mappával lejjebb viszi. Ha azonban ennyi szintje van, az nagy valószínűséggel azt jelenti, hogy webhelye felépítése szükségtelenül kínos.

" könyvtár/oldal.html "

" könyvtár1/könyvtár2/oldal.html "

../ Ha jelezni kell, hogy a hivatkozott fájl a szülőmappában van, használja a .. szimbólumokat (két pont), ezek azt jelentik, hogy egy szinttel feljebb lépünk (az aktuális könyvtár szülőmappájába). Ezután adjunk meg egy perjelet "/" az elérési út részei elválasztásához, és írjuk be a fájl nevét.

Megjegyzés: a .. szimbólumokat annyiszor használhatjuk egymás után, ahányszor csak akarjuk, ezek használatával minden alkalommal egy mappával feljebb lépünk. Azonban addig mászhat felfelé, amíg el nem éri webhelye gyökérmappáját. Nem léphet magasabbra ennél a mappánál.

"../oldal.html"

"../../oldal.html"

" ../../../cat1/cat2/page.html " - az aktuális mappából három könyvtárral feljebb megyünk és már onnan két szinttel lejjebb megyünk a kívánt fájlig

/ A relatív elérési útnak nem kell mindig a hivatkozási oldal aktuális helyéhez viszonyítva kezdődnie, hanem a webhely gyökérkönyvtárához képest is kezdődhet. Például, ha a kívánt fájl a gyökérkönyvtárban található, az elérési út kezdődhet a " / " karakterrel, amely után csak meg kell adnia a kívánt fájl nevét, amely a gyökérkönyvtárban található.

Megjegyzés: ha először a " / " karaktert adjuk meg, az azt jelenti, hogy az elérési út a gyökérkönyvtárból indul.

"/oldal.html"

"/cat1/cat2/car.png"

Abszolút út

Az abszolút elérési utat általában egy másik fájl elérési útjának megadására használjuk hálózati erőforrás. Ez egy fájl vagy oldal teljes URL-je. A címben mindenekelőtt a használt protokoll, majd a domain név (oldalnév) szerepel. Például: http://www.example.ru – így néz ki egy adott webhely abszolút elérési útja. A http:// egy adatátviteli protokoll, a www.example.ru pedig a webhely neve (domain).

Egy abszolút elérési út a saját webhelyén is használható. Egy webhelyen belül azonban ajánlatos egy relatív elérési utat használni hivatkozási értékként.

Most nézzük meg, mi az URL-cím. Az interneten minden weboldalnak megvan a maga egyedi címe, amelyet URL-nek neveznek. Rövidítés URL jelentése U egyenruha R forrás L ocator (Uniform Resource Address), egyszerűen fogalmazva, az URL egy erőforrás helymeghatározó. Ez a címírási mód szabványosított az interneten.

Ha hibát észlel, jelöljön ki egy szövegrészt, és nyomja meg a Ctrl + Enter billentyűket
OSSZA MEG: