Ang style sheet ay hindi konektado. Koneksyon sa pamamagitan ng panlabas na file. Ito ang pamagat sa pula

Sa kabanatang ito ay pag-uusapan natin kung paano ipatupad ang CSS sa isang HTML na dokumento, iyon ay, i-link ang paglalarawan ng istilo ng isang elemento nang direkta sa elemento mismo, ilang HTML tag.

Ipatupad gawaing ito posible sa tatlong paraan:

  • Sumulat ng paglalarawan ng istilo nang direkta sa mismong elemento. Ang pamamaraang ito ay mabuti lamang kung mayroon lamang isang ganoong elemento sa HTML na dokumento na nangangailangan ng hiwalay na paglalarawan ng istilo.
  • Sumulat ng paglalarawan ng istilo para sa lahat ng magkakaparehong elemento ng HTML na dokumento. Ang pamamaraang ito ay nabibigyang katwiran kung ang istilo ng pahina ay sa panimula ay naiiba sa pangkalahatang disenyo ng site (isang pangkat ng mga magkakaugnay na pahina).
  • I-extract ang paglalarawan ng istilo ng mga elemento ng HTML sa isang hiwalay na CSS file. Papayagan ka nitong pamahalaan ang disenyo ng buong site, ang bawat pahina ng site kung saan ipinahiwatig ang isang reference sa isang CSS file. Ang pamamaraang ito ay ang pinaka epektibong paggamit cascading style sheets.

Tingnan natin ang bawat opsyon, at sa parehong oras ay kilalanin ang mga patakaran ng CSS writing syntax.

Ang katangian ng istilo.

Halos bawat HTML tag ay may katangian istilo, na nagsasaad na ang isang partikular na paglalarawan ng istilo ay inilapat sa tag na ito.

Ito ay nakasulat tulad nito:

style="">

Lahat ng isusulat sa pagitan ng mga attribute quotes istilo at magiging isang paglalarawan ng istilo para sa ng elementong ito, V sa kasong ito elemento

Well halimbawa:

style="color: #ff0000; font-size:12px"> ito ay isang talata na may personal na istilo

Sa kasong ito, tinukoy namin na ang talatang ito ay dapat ipakita sa pula at may laki ng font na 12 pixels. Sa mga susunod na kabanata ay magsasalita ako nang detalyado tungkol sa kung ano ang nakasulat sa mga quote, ngayon pinag-uusapan natin tungkol sa kung paano ilapat ang CSS sa anumang HTML tag.

Gamit ang parehong prinsipyo, maaari mong tukuyin indibidwal na istilo para sa halos bawat elemento ng HTML.




katangian ng istilo

style="background-color: #c5ffa0">

style="color: #0000ff; font-size:18px">Lahat ng tungkol sa mga elepante



Bumili ng elepante


style="color: #ff0000; font-size:14px">


style="color: #0000ff; font-size:16px"> Magrenta ng elepante


style="color: #ff0000; font-size:14px">






Ngunit uulitin ko muli ang pamamaraang ito Pagpapatupad ng CSS mabuti lamang kung kailangan mong magbigay ng isang tiyak na istilo sa isang maliit na bilang Mga elemento ng HTML.

Tag (hindi malito sa katangian ng parehong pangalan) kung saan inilalarawan ang mga elementong kailangan natin.

Tingnan ang halimbawa, magkakaroon ng mga komento sa ibaba.




Tag ng istilo



Lahat tungkol sa mga elepante


Sa site na ito makikita mo ang anumang impormasyon tungkol sa mga elepante.


Bumili ng elepante


Sa amin kaya mo paborableng mga presyo bumili ng pinakamahusay na mga elepante!!


Magrenta ng elepante


Dito lang pwede magrenta ng kahit anong elepante!!






Tulad ng makikita mula sa halimbawa, nakamit namin ang eksaktong parehong resulta tulad ng sa unang kaso, ngayon lamang kami ay hindi nagtatalaga ng isang estilo sa bawat elemento nang paisa-isa, ngunit inilagay ito sa "ulo" ng dokumento, sa gayon ay nagpapahiwatig na ang lahat ng mga heading

,

- ang mga talata ay magiging asul

- pula. Isipin kung gaanong magiging madali ang ating gawain kung mayroong isang daang ganoong mga talata at humigit-kumulang labinlimang heading sa isang pahina, at ang dokumento mismo ay magiging mas mababa sa pamamagitan ng "pag-aalis" ng lahat ng paulit-ulit na paglalarawan ng istilo para sa bawat indibidwal na elemento.

Ngayon ang mga ipinangakong komento:

Tag mayroong direktang deklarasyon ng mga istilo ng ilang partikular na elemento ng HTML ayon sa sumusunod na syntax:

Kung ang ilang mga katangian ng isang elemento ay tinukoy sa isang bloke ng deklarasyon ng istilo, ang mga ito ay pinaghihiwalay ng isang semicolon.

CSS sa isang hiwalay na panlabas na file.

Gaano katagal aabutin upang makagawa ng isang mahabang kuwento maikli, dumating kami sa pangunahing, sa palagay ko, bentahe ng CSS, lalo na ang kakayahang ilagay ang lahat ng impormasyon na may kaugnayan sa disenyo ng site sa isang hiwalay na panlabas na file.

Kaya, buksan ang notepad (o isa pang editor) at isulat ang sumusunod na teksto dito:

Katawan (kulay ng background: #c5ffa0)
a (kulay:#000060; timbang ng font: bold;)
a:hover (color:#ff0000; font-weight: bold; text-decoration:none)
h1 (kulay: #0000ff; laki ng font:18px)
h2 (kulay: #ff00ff; laki ng font:16px)
p (kulay: #600000; laki ng font:14px)

Susubukan kong ipaliwanag nang detalyado ang isinulat namin tungkol sa kakaibang bagay na ito sa mga susunod na kabanata ng aklat na ito.

Lahat! Nagawa na ang file ng paglalarawan ng estilo! Ngayon ang lahat na natitira ay kaunti na lamang, ibig sabihin ay pilitin mga kinakailangang pahina aming website upang makakuha ng impormasyon mula sa file na ito.

Ginagawa ito gamit ang tag (koneksyon). Tag multi-purpose at nagsisilbing "i-link" ang isang HTML na dokumento na may karagdagang mga panlabas na file na nagsisiguro sa wastong operasyon nito. Tag ay isang uri ng link, hindi lamang nilayon para sa mga user, ngunit para sa mga browser program (browser). kasi nagdadala ng eksklusibong impormasyon ng serbisyo; ito ay matatagpuan sa ulo ng HTML na dokumento sa pagitan ng mga tag at hindi ipinapakita sa screen ng mga browser.

Tag may mga katangian:

href- Path sa file.
rel- Tinutukoy ang relasyon sa pagitan ng kasalukuyang dokumento at ang file na tinutukoy.
  • icon ng shortcut - Tinutukoy na ang kasamang file ay isang .
  • stylesheet- Tinutukoy na ang kasamang file ay naglalaman ng style sheet.
  • application/rss+xml - File in XML na format para ilarawan ang news feed.
uri - Uri ng MIME data ng file ng koneksyon.

Dahil nagsasama kami ng cascading style sheet bilang isang external na file, ang aming link ng serbisyo ay nasa sumusunod na anyo:

Inuulit ko, para tiyak na iwaksi ang mga posibleng hindi pagkakaunawaan. Katangian rel magtalaga ng halaga stylesheet Dahil kami ay nagkokonekta ng isang cascading style sheet bilang isang panlabas na file, ipinapahiwatig namin ang landas sa css file (sa halimbawang ito ang file ay tinatawag na mystyle.css at namamalagi sa tabi ng HTML na dokumento kung saan ito nakasulat ang link na ito) ipinapahiwatig din namin iyon ang file na ito teksto at naglalaman ng paglalarawan ng istilo type="text/css"

Ngayon ay ipinasok namin ang linyang ito sa mga header ng pahina ng aming site at tamasahin ang resulta..

mystyle.css file
katawan (kulay ng background: #c5ffa0)
a (kulay:#000060; timbang ng font: bold;)
a:hover (kulay:#ff0000; font-weight: bold; text-decoration: wala)
h1 (kulay: #0000ff; laki ng font:18px)
h2 (kulay: #ff00ff; laki ng font:16px)
p (kulay: #600000; laki ng font:14px)
Index.html file



cascading style sheet



Menu:


Lahat tungkol sa mga elepante.
Bumili ng elepante.
Magrenta ng elepante.


Lahat tungkol sa mga elepante


Sa site na ito makikita mo ang anumang impormasyon tungkol sa mga elepante.






File elephant.html



cascading style sheet



Menu:


Lahat tungkol sa mga elepante.
Bumili ng elepante.
Magrenta ng elepante.


Bumili ng elepante


Sa amin maaari kang bumili ng pinakamahusay na mga elepante sa mapagkumpitensyang presyo!!






File elephant1.html



cascading style sheet



Menu:


Lahat tungkol sa mga elepante.
Bumili ng elepante.
Magrenta ng elepante.


Magrenta ng elepante


Dito lang pwede magrenta ng kahit anong elepante!!






Sa halimbawa sa itaas, "site tungkol sa mga elepante", sa sa ngayon, mayroong tatlong pahina, bawat isa ay nauugnay sa isang panlabas na css file - mystyle.css. Kaya, makabuluhang "na-unload" namin ito at ginawang "mobile-friendly" ang disenyo ng buong site. Isipin kung gaano karaming kilobytes ang mapapanalo natin kung ang site na ito ay may isang daang ganap na pahina!? At gayundin, gaano karaming oras ang matitipid natin kung kailangan nating baguhin ang anumang bagay sa disenyo nito!?

Sa kabanatang ito, tumingin kami sa tatlong paraan upang i-embed ang CSS sa isang HTML na dokumento. Alin ang mas magandang gamitin?

  • Gumamit ng katangian istilo para sa anumang elemento, kung ang elementong ito na may kakaibang istilo sa ibang mga elemento ay ang isa lamang sa buong site.
  • Gumamit ng tag

    Unang antas ng header


    Pangalawang antas ng header, asul


    Pangatlong antas ng heading




    Mula sa halimbawa makikita mo na isinulat namin ang mga istilo bago ang pagsasara tag ng ulo sa loob ng pambungad at pagsasara ng mga tag istilo. Talagang tag istilo maaari ding isulat sa katawan, ngunit kung gusto mong magmukhang structured ang iyong mga post, at para hindi mahawakan ng taong makakita ng code na ito pagkatapos mo, mas mabuting magsulat ng mga istilo sa isang lugar.

    Ang kawalan ng built-in na style sheet ay halata din - ang mga naturang entry ay kailangang gawin para sa bawat pahina nang hiwalay.

    Hello my mahal na mga mambabasa blog site. Ang artikulo sa araw na ito ay tatalakayin ang tungkol sa mga pamamaraan o paraan ng pagsasama ng CSS style sheet. Sasabihin ko sa iyo kung paano mo magagawa ikonekta ang CSS sa html site apat na paraan. Ang apat na paraan ng koneksyon na ito ay magiging kapaki-pakinabang sa iyo sa hinaharap, dahil may mga pagkakataon na kailangan mong gamitin ang lahat ng paraan ng koneksyon na ito sa isang site. Para sa mga hindi alam kung ano ang CSS style sheets, .

    Magsimula tayo...

    Mga kaugnay na style sheet.

    Paraan ng koneksyon ng CSS - No. 1

    Ang paraan numero 1 ay ang pinaka maginhawang paraan pagtukoy ng mga istilo para sa site. Ang lahat ng mga estilo para sa site ay naka-imbak sa isang hiwalay na file at ginagamit para sa anumang mga web page. Para sa koneksyon o para sa pag-link Mga talahanayan ng CSS Upang html na pahina Ang LINK na tag ay ginagamit sa pamagat ng pahina.

    Halimbawa ng pagkonekta ng CSS table

    Heading



    Ang mga pakinabang ng pamamaraang ito:

    1. Gumamit ng isang CSS style file para sa lahat ng web page ng website;

    2. Maaari mong baguhin ang hitsura ng site sa pamamagitan ng style sheet nang hindi nag-e-edit ng mga web page;

    3. Kapag binago mo ang istilo sa isang style.css file, awtomatikong ilalapat ang istilo sa lahat ng page kung saan mayroong koneksyon sa CSS file. Ito ay napaka maginhawa;

    4. Kapag na-load ang website sa unang pagkakataon, naka-cache ang CSS style file lokal na kompyuter user, hiwalay sa mga web page, sa kadahilanang ito ay mas mabilis na naglo-load ang site.

    Mga global style sheet.

    Paraan ng koneksyon ng CSS - No. 2

    Ang Paraan No. 2 ay hindi kasing epektibo at maginhawa gaya ng paraan No. 1, ngunit may mga pagkakataon na ang pamamaraang ito ng pagkonekta ng CSS ay kinakailangan.
    Ang istilong ito ay konektado at nakasulat sa mismong dokumento at inilalagay sa header ng web page sa pagitan ng mga tag . Ikonekta ang style tag

    Halimbawa ng pagkonekta ng CSS table

    Heading



    Sa halimbawang ito ipinakita ko ang pagbabago ng istilo ng header

    . Ngayon sa web page na ito kailangan mo lang tukuyin ang tag

    at ang mga istilo ay awtomatikong idaragdag dito.

    Mga panloob na istilo.

    Paraan ng koneksyon ng CSS - No. 3

    Ginagamit ang Paraan No. 3 sa mga bihirang kaso. Ang isang inline na istilo ay ginagamit upang baguhin ang isang tag sa isang web page. Upang ikonekta ang isang istilo, gamitin ang parameter istilo.

    Halimbawa ng pagkonekta ng CSS table:

    Halimbawa ng pagkonekta ng CSS table

    Heading



    Pinagsamang paraan ng pagkonekta ng mga istilo.

    Paraan ng koneksyon ng CSS - No. 4

    Ang pamamaraang ito ay gumagamit ng ilang mga estilo nang sabay-sabay, na ginamit namin sa itaas (paraan No. 1 - No. 3).

    Halimbawa ng pagkonekta ng CSS table:

    Halimbawa ng pagkonekta ng CSS table

    Heading

    Heading



    Bilang resulta, kasunod ng halimbawa, makukuha natin ang unang heading na pula na may sukat na 50 pixels, at ang susunod - berde at may sukat na 90 pixels.

    Inuulit ko na ang lahat ng mga pamamaraan na inilarawan gamit ang CSS maaaring gamitin nang nakapag-iisa, o maaaring pagsamahin sa bawat isa. Ito ay makikita sa paraan No. 4.

    Mahirap isipin ang pagbabago ngayon hitsura At Pag-format ng HTML mga dokumento nang hindi gumagamit ng CSS style sheets, dahil matagal nang tumigil ang HTML na maging isang self-sufficient na wika ng disenyo at nagsimulang gawin ang orihinal nitong mga function ng pag-istruktura at pagmamarka ng mga dokumento sa web. Sa artikulong ito, idedetalye namin ang mga paraan kung saan maaari mong isama ang CSS sa isang HTML na dokumento.

    Maikling tungkol sa CSS at HTML

    Dati, ang disenyo ng web page ay ginawa ng eksklusibo gamit ang HTML. Sa ngayon, ang diskarte na ito ay hindi ginagawa, at para sa stylization ginagamit ang mga ito Mga tool sa CSS na may napaka sapat na pagkakataon upang lumikha ng mga nakamamanghang disenyo.

    Upang maipakita nang tama ang disenyo ng site, kailangan mong ikonekta ang CSS sa dokumentong HTML na gumagana nang hindi mapaghihiwalay sa isa't isa - nilikha ng HTML ang istraktura, at ang mga style sheet ay responsable para sa hitsura.

    Mayroong ilang mga pangunahing paraan kung saan maaari mong i-customize ang pagpapakita ng mga istilo sa iyong HTML code, bawat isa ay may sarili nitong mga kalamangan at kahinaan.

    Pagkonekta sa CSS file

    Ito ang pangunahing paraan na itinuturing ng mga developer bilang ang pinaka-praktikal at maginhawa.

    Gamit ang pamamaraang ito, maaari mong mabilis na baguhin ang disenyo ng isang web page kung mayroong ibinigay istraktura ng HTML dokumento - halimbawa, para sa parehong site maaari kang magsulat ng ilang mga pagpipilian sa disenyo at ikonekta ang mga ito depende sa kaukulang pangangailangan.

    Upang maisama ang isang file na may mga istilo, kailangan mo munang i-configure istraktura ng file- ito ay ginagawa upang ang tamang landas sa ang kinakailangang dokumento direkta sa code.

    Lumikha ng isang direktoryo kung saan matatagpuan ang pangunahing HTML na dokumento, sa parehong folder na gumawa sa text editor file na tinatawag na style at i-save ito sa .css resolution. Maglalaman ito ng CSS code kasama ang lahat ng tinukoy na mga panuntunan sa pag-istilo ng dokumento.

    Ang koneksyon ng CSS ay tapos na kapag tulong sa HTML tag na may katangiang href. Mukhang ganito:

    Narito ang code ay matatagpuan sa kung ano ang itinuturing na pinakamainam, ngunit hindi kinakailangan. Matatagpuan ito kahit saan sa dokumento.

    Ang pamamaraang ito ay maginhawa dahil ang lahat ng mga pagbabago sa style sheet ay ginawa sa isang hiwalay na file, na ginagawang mas madaling maunawaan at basahin ang code at ginagawang mas malinis ang dokumento.

    Kung gagawa ka ng mga pagbabago sa style.css at buksan ang index.html sa browser, makikita mo ang lahat ng mga pagbabagong ipinasok.

    Sa parehong paraan, maaari mong itakda hindi lamang ang landas sa file sa istraktura ng site, kundi pati na rin ang isang link sa pahina na may estilo na matatagpuan sa Internet. Sa kasong ito, umaangkop din ito sa mga panipi pagkatapos ng katangiang href.

    Paraan para sa pagkonekta ng isang style sheet mula sa hiwalay na file ino-optimize ang pagganap ng site, dahil pinapayagan nito ang browser na mag-load ng data mula sa cache, bilang resulta kung aling mga pahina ang naglo-load nang mas mabilis.

    Mga style sheet sa loob ng isang HTML na dokumento

    Minsan ang halaga ng isang parameter ng estilo ay direktang itinakda sa katawan ng HTML na dokumento gamit ang katangian ng estilo.

    Syntax:

    Ang teksto sa talatang ito ay pula

    Ang halatang disbentaha ay ang kakulangan ng pagiging pangkalahatan;

    Gayundin, ang pagkonekta gamit ang mga panloob na style sheet ay hindi nagpapahintulot sa browser na mag-cache ng impormasyon, hindi katulad ng nakaraang pamamaraan.

    Pandaigdigang istilo

    Kung kailangan mong mag-istilo ng isang partikular na elemento sa kabuuan ng isang HTML na dokumento, gamitin ang tag

    Ang tinukoy na istilo ay ilalapat sa tag

    , sa sandaling ito ay nakarehistro sa pahina.

    Ang pagsasama ng CSS sa ganitong paraan ay mababasa sa mas mataas na priyoridad ng browser kaysa sa panlabas na style sheet.

    Paano magdagdag ng font sa isang website

    Ang font ay isa sa mga pangunahing elemento ng disenyo ng anumang web page. Ang impression na ginagawa ng isang website sa isang user ay direktang nakasalalay sa font na ginamit. Sa kabutihang palad, hindi mo kailangang limitahan ang iyong sarili sa mga karaniwang headset;

    Gamit ang CSS, ang mga font ay konektado tulad ng sumusunod:

    • Maghanap at mag-download ng angkop na headset.
    • Buksan ang CSS file at isulat ang sumusunod na code dito:
    @font-face ( font-family: "Open Sans"; src: url("../fonts/OpenSans.ttf") format("truetype"); font-style: normal; font-weight: normal; )

    Una, ang pangalan ng font ay tinukoy, pagkatapos ay ang landas patungo dito, at sa wakas ang mga parameter. Mangyaring tandaan na sa halimbawang ito ang font file ay matatagpuan sa folder ng mga font, na, naman, ay matatagpuan sa root directory. Para sa kaginhawahan, mas mahusay na lumikha magkahiwalay na mga folder Para sa iba't ibang mga file at mga elemento (mga imahe, script, style sheet, atbp.).

    Kaya, sa folder ng mga font mayroon kaming isang file na tinatawag na OpenSans.ttf, na may karaniwang mga parameter. Ipapakita na ito ngayon sa browser.

    Pagkonekta sa font sa pamamagitan ng Google Fonts

    Ang isa sa mga pinakakaraniwang paraan upang ikonekta ang mga font sa CSS at HTML ay ang serbisyo Mga Font ng Google.

    Ang interface ay madaling maunawaan - kailangan mong makahanap ng angkop na font ayon sa pangalan o ibinigay na mga parameter, i-click ang button na Piliin ang font na ito, at ang serbisyo ay agad na bumubuo ng isang code na ipinasok sa field ng tag HTML na dokumento, pati na rin ang kaukulang CSS file na may mga istilo.

    Paano ito dapat magmukhang sa HTML:

    At sa CSS file may mga istilo:

    Font-family: "Open Sans", sans-serif;

    Ang pamamaraang ito ay maginhawa dahil pinapayagan ka nitong mabilis na makahanap gustong font mula sa isang napakalaking database at nakakatipid ng maraming oras, at inaalis din ang mga problema na lumitaw dahil sa hindi tamang pagpapakita ng mga font sa ilang mga browser.

    Isa-isahin natin

    Kaya, tiningnan namin ang mga pangunahing paraan upang ikonekta ang mga istilo ng CSS HTML na mga dokumento. Batay sa mga gawaing itinakda para sa developer sa bawat partikular na kaso, maaari mong piliin ang pinakamataas na priyoridad na opsyon.

    Ang disenyo ng web page ay malikhaing proseso, na, gayunpaman, ay nangangailangan ng maingat na diskarte. Samantalahin ang kakayahang magkomento sa code at huwag kalimutan ang tungkol sa pag-optimize ng website.

    Magandang araw sa lahat. Si Alexey Gulynin ay nakikipag-ugnayan. Sa unang artikulong ito sa CSS, gusto kong pag-usapan ang tungkol sa CSS sa pangkalahatan, at kung paano . Ang CSS ay Cascading Style Sheet(o simpleng tinatawag na mga estilo), na responsable para sa kung paano ipakita ang mga elemento sa iyong html na pahina. Kung magdaragdag ka lang ng mga elemento sa isang HTML na pahina nang walang mga katangian, ilalagay silang lahat mula sa itaas hanggang sa ibaba at ihahanay sa kaliwang bahagi ng browser. Ito ay boring at monotonous.

    Ang mga elemento ng HTML ay ang balangkas ng aming pahina, ibig sabihin. Ang html ay responsable para sa ANO ang ipapakita sa pahina. Sinasagot naman ng CSS kung PAANO ipakita ang lahat ng elementong ito. Maaari kang lumikha ng parehong pahina ng HTML at makabuo ng libu-libong mga pagpipilian sa disenyo para dito. At ang lahat ng ito ay magiging hitsura ng iba't ibang mga site. Maaari kang mag-surf sa Internet at makita kung gaano karaming magagandang site ang nasa mga kalawakan nito.

    Sa ngayon, dapat ay natanto mo na kung nais mong lumikha magandang disenyo, kung wala kang kaalaman sa CSS, hindi mo ito magagawa. Samakatuwid, magpatuloy upang maunawaan ang agham na ito na tinatawag na CSS.

    Ikonekta natin ang CSS style file sa html page. Ginagawa ito sa header ng dokumento, sa pagitan ng mga tag .. :

    Pagkonekta ng CSS

    Alamin natin kung ano ang isinulat natin dito. Nakakonekta ang mga style file gamit ang link tag. Ang katangian ng href, na pamilyar sa amin, ay tumuturo sa landas patungo sa style file. Dito maaari mong tukuyin ang parehong ganap at mga kamag-anak na landas. Sa kasong ito, ipinapalagay na ang aming style.css file ay matatagpuan sa parehong direktoryo ng file kung saan kami nagsasama ng mga estilo. Isinasaad ng attribute na type="type/css" na ang uri ng dokumento ay css, ang attribute na rel="stylesheet" ay nagsasabi sa browser na nagsasama kami ng mga istilo (rel mula sa English na "relationship" - relationships).

    Maaari ka ring mag-istilo ng mga elemento sa iba pang mga paraan. Gumawa tayo ng html page na may sumusunod na nilalaman:

    Pagkonekta ng CSS

    Unang talata

    Unang talata

    Unang talata

    Unang talata



    Bilang karagdagan sa paggawa ng style file, maaari tayong magsulat ng mga istilo sa ulo ng dokumento gamit ang tag

    Unang talata

    Pangalawang talata

    Pangatlong talata

    Ikaapat na talata



    Ang mga istilo ay maaari ding itakda nang direkta sa elemento gamit ang katangian ng istilo (ito ang tinatawag na inline na istilo). Gawin nating berde at nakahanay sa kanan ang pangalawang talata. Upang gawin ito kailangan mong idagdag ang sumusunod na konstruksyon:

    Pangalawang talata

    Ngayon nakita natin na ang talata ay naging berde at nakahanay sa kanan.

    May isa pang paraan upang magdagdag ng mga istilo sa isang HTML na pahina. Ito imported na mga istilo. Nakatakda ang mga ito sa header ng page, ngunit mula sa isang file, hindi direkta:

    Kapag nagdadagdag ng mga istilo sa isang page, maaari kang makatagpo mga sitwasyon ng salungatan. Halimbawa, sa isang style file maaari naming itakda ang kulay ng teksto ng lahat ng mga talata (p tag) sa pula, at maglapat ng inline na istilo sa isa sa mga ito. Paano masasabi ng browser kung aling kulay ang gagamitin? Tukuyin natin ang mga priyoridad na ginagamit ng browser:

    1) Mga istilo mula sa file (may pinakamababang priyoridad)
    2) Mga na-import na istilo
    3) Mga naka-embed na istilo
    4) mga inline na istilo (may pinakamaraming mataas na priyoridad, ibig sabihin. ipapatupad muna ng browser ang mga ito).

    Sa artikulong ito natutunan mo kung paano mo magagawa ikonekta ang CSS sa html na pahina at kung paano mo mailalapat ang mga istilong ito.

    Nakipag-ugnayan si Alexey Gulynin, iwanan ang iyong mga komento, makita ka sa susunod na mga artikulo.