Mobile változata az oldalon a wordpress

Ahhoz, hogy a munka elvégzése, szükség van legalább egy alapvető ismereteket a CSS-szabályok, ez a fő asztalra, amely felelős a tervezési és megjelenése a helyszínen. Ez egy nagy lehetőség, hogy tervezzen, ami a különféle hatások, speciális effektusok, amelyet csak a képzelet a tervezők.







Térjünk a tárgyra.

Az első lépés az, hogy csatlakoztassa a CSS táblázat a mobil eszközök. Ehhez menj a szettet, és nyissa meg a header.php témafájlt. Itt látható a CSS szabvány kapcsolat, ez így néz ki:

És módosítsa ezeket a sorokat a következő:

A második lépés fogunk létrehozni egy táblázatot a mobil változat. Ismét kapcsolja témánk, azt látjuk, a főtábla CSS «style.css» és másoljuk egy mappába, vagy az asztalon (ahol szívesebben), a fő példányt. Ezután átnevezés mobil-style (Megjegyzendő, hogy korábban már szerelve a táblázat a mobil eszközök az úgynevezett mobil-style.css. Ha átnevezi egy teljesen más nevet, ne felejtsük el, hogy változtassa meg, és csatlakozzon.) Vigye vissza témánk.

A harmadik lépés - ez az alapvető lépés. Meg kell teljesen megváltoztatni a szerkezetét a webhely, felesleges ingatlanok, átméretezése és módosítja a kampány esetében különböző dolog. Open, az asztal, amit létre mobil eszközök az én esetemben, a mobil-style.css. Az első és legfontosabb, nézzük foglalkozik az alapvető építőkövei, amelyek az egész honlapunkon. Sok tárgyak, vagy meghatározza az osztály azonosító úgynevezett «wrapper», a változás a stílus egysége a következő:

A fő stílus szélessége a «szélesség» blokk, akkor fix, hogy az 300px, azt hiszem, ez a legjobb méret. Azt is megadhatja a szélességet százalékában „100%”, de én hangsúlyozni, hogy a mobil eszköz, így nem kell egy úszó szélességét. Ezután fogjuk változtatni a stílusát az egység #header erről:







Ezután jön a «logo» telephely neve megjelenik a blokkfejlécben. Adunk ezeket a stílusokat:

A navigáció, akkor egy kicsit bonyolultabb, kívánatos alakítani egy legördülő listából többféle menüpontok mászni a tetején egymással, ami nem túl jó. Számos módja van, hogy megoldja ezt a problémát, a legkönnyebb telepíteni egy speciális nevű plugint WP Mobile menü. Ha a plug-in - ez már nem az opciót, akkor a mobil menü segítségével a jQuery, scriptek, de itt meg kell bütykölni.

Következő megyünk központi egység «tartalom», arra is szükség van, hogy stílust váltani, körülbelül a következő:

Felhívjuk figyelmét, hogy megváltozott a tulajdonságok a float: left; vagy talán float: right; A float: none;. Ezért megszüntetésével körüli áramlás a blokkokat, és a szerkezet építési telek most épül egy sorban, egymás után.

Az utolsó dolog, ami maradt, hogy véglegesítse a részletekre, szélességének beállításához footer'a százalékos változás a betűméretet (ha szükséges), és a többi, hogy nem néz helyes. És a nagy, nehéz pontosan megmondani, hogy mi lesz, hogy változtatni kell, ez az egész dolog történik egy kampányt. Alapvetően megértjük - fontos, és érdemes megfontolni azonosítók, hogy én példaként - feltételes. Ez nem minden tantárgyban, így lehet nevezni, így azt tanácsolom, hogy a plug-in a Mozilla Firebug. Ez volt az egyik módja, hogy hozzon létre egy mobil változata a honlapon a WordPress.

Lásd még:

Mobile változata az oldalon a wordpress

mobil menü plugint a WordPress

Mobile változata az oldalon a wordpress

Állítsa kontúr ikonok különböző témákban

Mobile változata az oldalon a wordpress

Creative logók inspirációt

Mobile változata az oldalon a wordpress

Animált hover hatása web ikonok betűtípus Awesome font




Kapcsolódó cikkek