Si ta ndryshoni ngjyrën e një fjale me etiketën Span dhe CSS

Me CSS , është e lehtë për të vendosur ngjyrën e tekstit në një dokument. Nëse doni që paragrafët në faqen tuaj të paraqiten në një ngjyrë të caktuar, thjesht specifikoni se në fletën tuaj të jashtme të stilit dhe shfletuesi do të shfaq tekstin tuaj në atë ngjyrë të zgjedhur. Çfarë ndodh atëherë kur doni të ndryshoni ngjyrën e vetëm një fjale (ose ndoshta vetëm disa fjalë) brenda një paragrafi të tekstit? Për këtë, do të duhet të përdorësh një element inline si tag.

Në fund të fundit, ndryshimi i ngjyrës së një fjale të vetme ose të një grupi të vogël fjalësh brenda një fjali është e lehtë duke përdorur CSS dhe etiketat janë HTML të vlefshme, prandaj mos u shqetësoni për këtë që të jetë një lloj hack. Me këtë qasje, ju gjithashtu shmangni përdorimin e etiketave të vjetruara dhe atributeve si "font", që është produkt i një epoke të kaluar HTML.

Ky artikull është për fillimin e zhvilluesve të uebit, të cilët kanë gjasa të reja për HTML dhe CSS. Kjo do t'ju ndihmojë të mësoni se si të përdorni HTML tag dhe CSS për të ndryshuar ngjyrën e tekstit të veçantë në faqet tuaja. Kjo u tha, ka disa të meta për këtë metodë, të cilën do ta mbuloj në fund të këtij artikulli. Për momentin, lexoni për të mësuar hapat për të ndryshuar këtë ngjyrë teksti! Është shumë e lehtë dhe duhet të zgjasë rreth 2 minuta.

Udhëzimi hap pas hapi

  1. Hapni faqen e internetit që dëshironi të përditësoni në tekstin tuaj të preferuar të redaktuesit HTML. Ky mund të jetë një program si Adobe Dreamweaver ose një redaktor teksti thjesht si Notepad, Notepad ++, TextEdit, etj.
  2. Në dokumentin, gjeni fjalët që dëshironi të shfaqen në një ngjyrë të ndryshme në faqe. Për hir të këtij udhezimi, lejon të përdorësh disa fjalë që janë brenda një paragrafi më të madh të tekstit. Ky tekst do të përfshihet brenda ciftit të artikullit. Gjeni njërën prej dy fjalëve ngjyrën e të cilës dëshironi të redaktoni.
  3. Vendosni kursorin para shkronjës së parë në fjalën ose grupin e fjalëve që dëshironi të ndryshoni ngjyrën. Mos harroni, nëse po përdorni një redaktor WYSIWYG si Dreamweaver, tani po punoni në "shikimin e kodit".
  4. Le të përfundojë teksti ngjyra e të cilit ne duam të ndryshojmë me një etiketë, duke përfshirë një atribut të klasës. I gjithë paragrafi mund të duket kështu: Ky është teksti që është i përqendruar në një fjali.
  5. Ne kemi përdorur vetëm një element inline, të, për të dhënë atë tekst të veçantë një "hundë" që ne mund të përdorim në CSS. Hapi ynë i ardhshëm është të hidhen në skedarin tonë të jashtëm CSS për të shtuar një rregull të ri.
  1. Në skedarin tonë CSS, le të shtojmë:
    1. .focus-text {
    2. ngjyra: # F00;
    3. }
  2. Ky rregull do ta vendosë atë element inline, për të shfaqur në ngjyrën e kuqe. Nëse do të kishim një stil të mëparshëm që e vendoste tekstin e dokumentit tonë në të zezë, ky stil inline do të shkaktonte që teksti i span të përqendrohej dhe të dilte me ngjyrë të ndryshme. Ne gjithashtu mund të shtoni stile të tjera në këtë rregull, ndoshta duke e bërë tekstin e shkronjave ose të guximshme për ta theksuar atë edhe më shumë?
  3. Ruaj faqen tënde.
  4. Testoni faqen në shfletuesin tuaj të preferuar për të parë ndryshimet në fuqi.
  5. Vini re se përveç disa profesionistëve të web-it zgjedhin të përdorin elementë të tjerë si çifti ose etiketa. Këto etiketa përdoreshin në mënyrë specifike për "bold" dhe "italics", por ishin të vjetruara dhe të zëvendësuara me dhe. Etiket ende funksionojnë në shfletuesit modernë, megjithatë, aq shumë zhvillues web i përdorin ato si inline styling hooks. Kjo nuk është qasja më e keqe, por në qoftë se ju doni të shmangni ndonjë element të vjetëruar, sugjeroj që të qëndroni me etiketë për këto lloj nevojash styling.

Këshilla dhe Gjërat për të Ruajtur

Ndërsa kjo qasje funksionon mirë për nevojat e vogla të stilit, si në qoftë se keni nevojë të ndryshoni vetëm një pjesë të vogël të tekstit në një dokument, shpejt mund të dilni jashtë kontrollit. Nëse gjeni se faqja jote është e mbushur me elemente inline, të cilat kanë klasa unike që po përdorni në skedarin tuaj CSS, mund ta bëni atë gabim, Mos harroni, më shumë prej këtyre etiketave që janë në faqen tuaj, aq më e vështirë ka të ngjarë të jetë për të ruajtur atë faqe duke shkuar përpara. Përveç kësaj, tipografi e mirë në internet rrallëherë ka shumë variante të ngjyrës, etj. Në të gjithë faqen!