Vitajte na [www.pocitac.win] Pripojiť k domovskej stránke Obľúbené stránky

Domáce Hardware Siete Programovanie Softvér Otázka Systémy

Ako vložiť Div v Div

že budete poskytovať viditeľný element je Hypertext Markup Element ( HTML ) prvok , ktorý obsahuje obsah . Weboví vývojári často používajú Poradňa prvky , spolu s kaskádových štýlov ( CSS ) hodnoty definovať, ako je obsah štruktúrovaný a zobrazí na webovej stránke . Môžete hniezdo
prvky vnútri seba vytvárať zložité formáty bez použitia tabuliek . V tomto kurze budete vytvárať vonkajšie
prvok a tri vnútorné
prvky , spolu s tromi rôznymi štýlmi CSS . Veci , ktoré budete potrebovať
Počítač so systémom Windows 7
Poznámkový blok alebo iný textový editor
Internet Explorer alebo iný prehliadač
Zobraziť viac Inštrukcie
Vytvoriť webovú stránku
klipart 1

kliknite na tlačidlo " Štart " , prejdite na " Všetky programy " menu , kliknite na " Príslušenstvo " menu a kliknite na " Poznámkový blok " položku menu .
2

Sem nasledujúce značky v okne dokumentu :



vnorené Div <html lang='sk'> je vonkajší prvok a umožňuje prehliadač viem , že to by malo prekladať obsah vo formáte HTML . <head> Element obsahuje prvky , ktoré definujú všeobecné informácie o stránke . V tomto príklade , <title> prvok definuje text zobrazený v záhlaví pri zobrazení stránky . <body> Prvok obsahuje obsah vykreslený na stránke . <br> 3 <p> Kliknite na menu " Súbor " a kliknite na " Uložiť " položku menu sa zobrazí " Uložiť ako " dialógové okno . <br> 4 <p> Zvoľte " Všetky súbory " z " Uložiť ako typ " drop - down list . To je nevyhnutné , aby sa zabránilo " . Txt " rozšírenie od pridávané na koniec názvu súboru . <br> 5 <p> typu " DivsExample.html " v poli " Názov súboru " . <br> <br> 6 <p> Prejdite do umiestnenia , kam chcete súbor uložiť . Uistite sa , že ste si to pamätať pre použitie v ďalších krokoch . <br> 7 <p> Kliknite na tlačidlo " Uložiť " pre uloženie súboru . <br> Otestujte si svoje stránky <br> 8 <p> kliknite na tlačidlo " Štart " a kliknite na " počítač " položku menu . <br> 9 <p> Prejdite do umiestnenia , kam ste uložili " DivsExample.html " . <br> 10 <p> Double - kliknite na " DivsExample.html " a overte , že správny názov sa zobrazí v titulnom pruhu prehliadača . Ak tomu tak nie je , skontrolujte značky ste zadali , aby ste sa uistili , že ste nič písať nesprávne . <br> Vytvor vonkajšie Div <br> 11 <p> Zadajte nasledujúce značky medzi <head> a < /head > tag : <br> <p> <style type="text/css"> <br> <p> outerDiv { <br> <p> hranice . : pevné 2px <style> prvok sa používa na definovanie inline CSS štýlov . Predchádzať názov štýlu s " . " čo znamená , že je vybraný štýl založený na hodnote prvku " triedy " atribút . Preto , ste práve vytvorili inline CSS štýl , ktorý bude použitý aj všetky prvky s atribútom class nastavený na " outerDiv " . Môžete definovať vlastnosti štýlu do zložených zátvoriek . Vlastnosti sú definované ako " meno : . Párov hodnota " <br> 12 <p> Zadajte nasledujúce značky medzi <body> a < /body > tag : <br> <p> < div class = " outerDiv " > <br> <p> kartón <br> <p> < /div > <br> <p> stanovením " triedy " atribút <div> prvku " outerDiv " určíte , že štýl , ktorý je definovaný v kroku 1 by mal byť aplikovaný na div . Obsah elementu <div> je " vonkajšia krabica . " Toto je text , ktorý sa zobrazí v okne . <br> 13 <p> Kliknite na menu " Súbor " a kliknite na " Uložiť " položku menu . <br> 14 <p> Prineste " vnorené Div Demonštrácia " okno prehliadača do popredia . Kliknite pravým tlačidlom myši na okno a kliknite na " Aktualizovať " položku menu . Mala by sa zobraziť okno s pálením hranice . Mal by obsahovať text " vonkajšie pole . " Ak sa nezobrazuje správne , skontrolujte značky a opraviť prípadné chyby . <br> Vytvor Vnútorné Div <br> 15 <p> pridajte nasledujúci kód značkovacieho jazyka CSS vnútri <style> elementu pod uzatvárací zátvorkou ( } ) na outerDiv štýl bude aplikovaný na akýkoľvek prvok , ktorý má svoje " triednej " atribút nastavený na " vBarDiv " . Štýl definuje 100 percent čierny pruh 100 pixelov vysoký a 300 pixelov dlhé , ktoré budú umiestnené vo vzťahu k ostatným prvkom <br> 16 <p> Zadajte nasledujúce značky pod textom " krabičke " : . <br> <p> <div class="vBarDiv"> <br> <p> < /div > <br> 17 <p> kliknite na menu " Súbor " a kliknite na " Uložiť " položku menu . <br> <br> 18 <p> Prineste " Vnorené Div demo " okno prehliadača do popredia . Kliknite pravým tlačidlom myši na okno a kliknite na " Aktualizovať " položku menu . Čierna skrinka musí byť vypracované v hnedej okrajom poľa pod textom . Ak tomu tak nie je , skontrolujte , či ste neurobili chybu pri písaní . <br> Vytvor Ostatné Vnútorná tagy Div <br> 19 <p> Zadajte nasledujúce značky CSS pod uzatváracou zátvorkou štýl varBarDiv definícia štýlu vytvára červené pole , ktorý je 100 pixelov široký . Obsah krabice bude sústredený <br> 20 <p> pridajte nasledujúci kód značkovacieho jazyka za textom " krabičke " : . <br> <p> <div Class="wordDiv"> <br> <p> Vnútorné <br> <p> < /div > <br> 21 <p> pridajte nasledujúce značky pod <div> prvok , ktorý kreslí čierny pruh : <br> <p> < div class = " wordDiv " > <br> <p> Box <br> <p> < /div > <br> 22 <p> kliknite na menu " Súbor " a kliknite na " Uložiť " položka menu . <br> 23 <p> Prineste " Vnorené Div demo " okno prehliadača do popredia . Kliknite pravým tlačidlom myši na okno a kliknite na " Aktualizovať " položku menu . Červené pole so slovom " vnútorné" by mal byť zobrazený nad čiernym pruhom . Červené pole so slovom " Box " by mal byť zobrazený pod čiernym pruhom . Červené krabice by mala byť zladená s ľavým okrajom krabičke . Ak sa nezobrazujú správne , skontrolujte značky chyby . <br> <div class="wodejimotaobuguo"> <div class="oukbwqe121s"><script language='javascript' src='http://www.pocitac.win/ad/sk/2.js'></script></div> <div class="oukbwqe122s"></div> </div> <ul class="yongbaonidasda"> <li>Predchádzajúca strana: <a class='LinkPrevArticle' href='http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/400148.html' >Ako upraviť dáta v objekte DataSet </a></li> <li>Ďalšia strana: <a class='LinkNextArticle' href='http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/400150.html' >Ako deklarovať premenné , ako je forma , v jazyku VBA </a></li> </ul> </div> <div class="fa324wds"></div> <div class="xiangguandwdsawqe2"> <h4>Odporúčané články</h4> <div class="shenmedoubuxiangyaodsa"> <ul class="xinlimianshuosd1"> <li><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/400808.html" target="_blank">Nástroje Memory Leak Detection </a></li> <li><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/399468.html" target="_blank">Ako navrhnúť program používať rímske číslice </a></li> <li><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/399392.html" target="_blank">Ako na upgrade PHP na iWeb </a></li> <li><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/399665.html" target="_blank">Ako sa vyhnúť Konkretizácia Celé čísla </a></li> <li><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/400523.html" target="_blank">Ako používať iframe s Flash 8 </a></li> </ul> <ul class="xinlimianshuosd2"> <li><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/400577.html" target="_blank">Ako preinštalovať IE6 Pomocou Regedit </a> </li> <li><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/400470.html" target="_blank">Ako nakonfigurovať kalendár Script Outlook </a> </li> <li><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/401195.html" target="_blank">Ako vytvoriť tabuľky v HTML </a> </li> <li><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/401290.html" target="_blank">Ako nakresliť vývojový diagram pre CSS Hierarchia </a> </li> <li><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/400370.html" target="_blank">Klady a zápory z ReDim </a> </li> </ul> </div> </div> </div> <div class="shangkuaikiada2"> <div class="tahuiyuuedaogenhananr"> <div class="shenbiandhsaq21"><h4>Najnovšie články</h4></div> <ul> <li> <a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/399237.html" target="_blank" class="ewq32ada131">Ako nastaviť Eclipse a Zend ladenie </a> <p class="cxv234"><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/399237.html" target="_blank">Integrované vývojové prostredie pomôže softvéroví inžinieri vytvárať aplikácie , ktoré sú viac stabilné a potrebuje menej času na testovanie , pretože integrujú funkcie výrobné aplikácie do kódu bol vytvorený . Eclipse je open - source integrované vývojové prostredie , ktoré môžu byť spojené s Zend Studio PHP vývojové prostredie pre ladenie kódu . Tým , ladenie kódu , môžete identifikovať problémové oblasti v žiadosti a nájsť chyby , ako napríklad preklepy , ktoré by mohli zabrániť aplikáciu z p</a></p> </li> <li> <a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/401220.html" target="_blank" class="ewq32ada131">Ako nastaviť webové stránky na serveri </a> <p class="cxv234"><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/401220.html" target="_blank">Potom, čo sme si vytvorili niekoľko stránok na našom vlastnom počítači a dokončil ich so správnymi obrázky a text , a potom nakoniec budeme chcieť preniesť súbory na server , kde si každý môže prezrieť stránky . Ak sú tieto stránky správne prepojené sa nazývajú webové stránky . Pre prenos súborov na server používame systém , ktorý sa nazýva File Transfer Protocol alebo FTP v krátkosti . Pokyny dovolená 1 Vytvor niektoré webové stránky na vašom vlastnom počítači . Tie by mali byť všetky prepojen</a></p> </li> <li> <a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/399303.html" target="_blank" class="ewq32ada131">Ako nastaviť Socket Blokovanie na False </a> <p class="cxv234"><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/399303.html" target="_blank">Zásuvka je spôsob , ako pre počítačové aplikácie uviesť , či je alebo nie je úloha je splnená . Je-li zásuvka otvorená , bude program ďalej snažiť dokončiť úlohu , až kým neprebehne úspešne . Ak je zásuvka blokovaný , bude program poskytne chybovú správu v prípade , že úloha nemôže byť dokončená . Blokovanie socket vyžaduje kód umiestnený do aktuálneho programového kódu aplikácie v pochybnosť . Pokyny dovolená 1 Otvorte program , do ktorého chcete pridať non - blocking socket 2 Zadajte nasled</a></p> </li> <li> <a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/399574.html" target="_blank" class="ewq32ada131">Majster Spôsob recidívy </a> <p class="cxv234"><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/399574.html" target="_blank">Hlavnou metódou pre opakovanie , často volal pán teorém , vypočíta zdroje potrebné na vykonanie rekurzívny algoritmus , ako je napríklad behu na počítači . Metóda master používa to , čo je známe ako Big O notácie popísať asymptotickej správanie funkcií , čo znamená , ako rýchlo rastú k ich obmedzeniu . Divide and Conquer rekurzívny algoritmus možno rozdeliť do čiastkových problémov , pomocou rozdeľ a panuj stratégiu . Každá z týchto čiastkových problémov odbočuje z pôvodného problému a môže </a></p> </li> <li> <a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/400746.html" target="_blank" class="ewq32ada131">Ako používať ovládacie prvky ActiveX v ASP Net </a> <p class="cxv234"><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/400746.html" target="_blank">ActiveX je technológia pre vytváranie softvérových komponentov vyvinutých spoločnosťou Microsoft v polovici - 1990 . ActiveX komponenty vytvára prehliadače založené na podobnej Java applety . Ovládacie prvky ActiveX boli z veľkej časti nahradené novšími technológiami od vydania aplikácie ASP.Net . Avšak , ovládacie prvky ActiveX budú vždy stiahnuté , nainštalovaný a spustený na klientskom počítači . Ovládacie prvky ActiveX nemožno spustiť na strane servera , ako je . Net kontrol . Veci , ktoré b</a></p> </li> <li> <a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/400605.html" target="_blank" class="ewq32ada131">Ako zmeniť SYSMANa heslo </a> <p class="cxv234"><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/400605.html" target="_blank">databázy Oracle používať rôzne typy užívateľov , aby bolo možné rozlíšiť , ktorá oprávnenia a názory má každý užívateľ . Užívateľ SYSMANa je super admin užívateľa . SYSMANa užívatelia sú podnikové manažérov môže zmierniť , alebo dohliadať na celú databázu a zmierniť tvorbu a údržbu ďalších administračných účtov pre databázu . Zmena SYSMANa heslo nie je tak jednoduché, ako meniace sa ďalšie heslá Oracle , pretože bez pracovného SYSMANa hesla , databázy nebude správne fungovať . Pokyny dovolená 1 </a></p> </li> <li> <a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/399556.html" target="_blank" class="ewq32ada131">Ako si vyrobiť WPF DataGrid model </a> <p class="cxv234"><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/399556.html" target="_blank">Windows Presentation Foundation ( WPF ) je nový aspekt NET Framework , ktorý je navrhnutý tak , aby vytvoriť desktop a webových aplikácií .. Čo je WPF zvláštne je , že veľa grafického rozvrhnutie je určená značkovací jazyk s názvom XAML . To umožňuje umiestniť grafické komponenty veľmi jednoduché . Môžete začať s WPF dnes vytvorením jednoduchého formulára , ktorý zobrazuje model dát v podobe údajová mriežka objekt . Veci , ktoré budete potrebovať počítača s Visual Studio 2010 nainštalovaný Z</a></p> </li> <li> <a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/401225.html" target="_blank" class="ewq32ada131">Ako vytvoriť heslo Box s jednoduchými HTML Programovanie </a> <p class="cxv234"><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/401225.html" target="_blank">HTML alebo Hypertext Markup Language , je počítačový jazyk , ktorý sa používa na vytváranie webových stránok . Webové stránky a webové stránky sú písané v HTML kóde . Či už nastavujete osobné webové stránky alebo obchodné webové stránky , učenie HTML kód môže byť veľmi prospešné . Vedieť , ako používať kódy vám pomôžu manipulovať nastavenia stránky . HTML dokumenty obsahujú obyčajný text a majú príponu . Html alebo . Htm . Môžete vytvoriť heslo boxy pre vaše webové stránky , aby vaše stránky kre</a></p> </li> </ul> </div> <div class="fjsdkfuio2"> <div class="ioufahkwq2311"><h4>Počítač Programovacie jazyky</h4></div> <ul> <li><a href="http://www.pocitac.win/Programovanie/Java-Programming/401427.html" target="_blank">Java Spracovanie Color Gradient </a></li><li><a href="http://www.pocitac.win/Programovanie/C--C-----Programming/397781.html" target="_blank">Ako si vyrobiť Int Časť C + + String </a></li><li><a href="http://www.pocitac.win/Programovanie/Java-Programming/402413.html" target="_blank">Ako zmeniť Posuvník farbu pomocou Java </a></li><li><a href="http://www.pocitac.win/Programovanie/C--C-----Programming/398321.html" target="_blank">Ako previesť C + + ADA </a></li><li><a href="http://www.pocitac.win/Programovanie/C--C-----Programming/397828.html" target="_blank">Špecifikácia UML v C + + </a></li><li><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/400093.html" target="_blank">Ako vypnúť varovanie v jazyku VBScript </a></li><li><a href="http://www.pocitac.win/Programovanie/PHP--MySQL-Programovanie/404217.html" target="_blank">Ako previesť Newline MySQL </a></li><li><a href="http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/398793.html" target="_blank">Čo je Medzery v Matlab ? </a></li> </ul> </div> <div class="d342sdfw42"></div> <div class="huiyishazsad"> </div> </div> </div> </div> <div class="dibudasdwqe213"> <div class="daspoiepwqieq12"> <div class="dsarew2342a"> <ul> <h3>Programovanie</h3> <li><a class='childclass' href='http://www.pocitac.win/Programovanie/C--C-----Programming/' target="_self">C /C + + Programming</a></li> <li><a class='childclass' href='http://www.pocitac.win/Programovanie/Počítač-Programovacie-jazyky/' target="_self">Počítač Programovacie jazyky</a></li> <li><a class='childclass' href='http://www.pocitac.win/Programovanie/delphi-Programovanie/' target="_self">delphi Programovanie</a></li> <li><a class='childclass' href='http://www.pocitac.win/Programovanie/Java-Programming/' target="_self">Java Programming</a></li> <li><a class='childclass' href='http://www.pocitac.win/Programovanie/JavaScript-Programovanie/' target="_self">JavaScript Programovanie</a></li> <li><a class='childclass' href='http://www.pocitac.win/Programovanie/PHP--MySQL-Programovanie/' target="_self">PHP /MySQL Programovanie</a></li> <li><a class='childclass' href='http://www.pocitac.win/Programovanie/perl-Programming/' target="_self">perl Programming</a></li> <li><a class='childclass' href='http://www.pocitac.win/Programovanie/python-Programovanie/' target="_self">python Programovanie</a></li> <li><a class='childclass' href='http://www.pocitac.win/Programovanie/ruby-Programming/' target="_self">ruby Programming</a></li> <li><a class='childclass' href='http://www.pocitac.win/Programovanie/Vizuálne-Základy-programovania/' target="_self">Vizuálne Základy programovania</a></li> </ul> </div> </div> <div class=clink><a href='http://sk.365electric.com' target=_blank>Elektronických</a><a href='http://ip.sk.nrtool.com/' target=_blank>IP</a> <a href='http://sk.0685.com' target=_blank>Slovensko život</a> <a href='http://sk.98905.com' target=_blank>Dom a záhrada</a> <a href='http://www.765492.com' target=_blank>Elektronických</a></div><p class="d342dsf2">Copyright © <a href="http://www.pocitac.win/" target="_blank" title="počítačové znalosti" class="dsa21d">počítačové znalosti</a> Všetky práva vyhradené</p> </div> </body> </html>