CSS ашиглан , текстийн өнгөийг баримтад байрлуулах нь хялбар байдаг. Хэрвээ таны хуудсан дээрх догол мөрийг тодорхой өнгөт хэлбэрээр оруулахыг хүсвэл, та гадаад загварын хуудсан дээр хөтөч таны сонгосон өнгөөр таны текстийг харуулах болно. Тэгвэл текстийн нэг догол мөрний дотор нэг үг (эсвэл цөөхөн хэдэн үгнүүдийн) өнгийг өөрчлөхийг хүсч байна вэ? Үүний тулд та tag хэлбэрээр inline элементийг ашиглах хэрэгтэй болно.
Эцэст нь, өгүүлбэр дотор нэг үг эсвэл жижиг үсгийг өнгөөр нь өөрчлөх нь CSS ашиглан хялбар, шошго нь зөв HTML, тиймээс энэ нь зарим төрлийн хакердах болно гэж санаа зовох хэрэггүй. Энэ аргыг хэрэглэснээр та хуучин HTML-ийн эрин үеийн бүтээгдэхүүн болох "үсгийн" гэх мэт элэгдлийн хаягууд болон шинж чанаруудыг хэрэглэхээс зайлсхийх хэрэгтэй.
Энэ нийтлэл нь HTML болон CSS-д шинэ байж магадгүй вэб хөгжүүлэгчдийн эхэнд зориулагдсан юм. Энэ нь танд HTML хуудас болон CSS ашиглахыг сурахад тань туслах болно. Энэ аргын зарим нэг дутагдалтай тал байдаг бөгөөд энэ өгүүллийн төгсгөлд би хамрах болно. Одоо текстийн өнгийг өөрчлөх алхмуудыг мэдэж аваарай. Энэ нь маш хялбар бөгөөд ойролцоогоор 2 минут болно.
Алхам зааварчилгааны алхам
- Өөрийн дуртай текст HTML засварлагч дээр шинэчлэхийг хүсч буй вэб хуудсыг нээ. Энэ нь Adobe Dreamweaver шиг програм эсвэл Notepad, Notepad ++, TextEdit гэх мэт текст засварлагч гэх мэт текст засварлагч байж болох юм.
- Баримт бичигт хуудас дээр өөр өнгөөр харуулахыг хүссэн үгсийг олох. Энэ гарын авлагын хувьд, текстийн том догол мөр дотор байгаа зарим үгсийг ашиглахыг зөвшөөрнө үү. Энэ текст нь боодол хос дотор багтах болно. Эдний өнгө оруулахыг хүссэн хоёр үгийн аль нэгийг олно уу.
- Өнгө үсгийг өөрчлөхийг хүссэн үгээр эсвэл бүлэг үсгээр эхний үсгээс өмнө таны курсороо байрлуул. Хэрэв та Dreamweaver шиг WYSIWYG редактор ашиглаж байгаа бол одоо "код харах" горимд ажиллаж байна.
- Ангилах шинж чанарыг оруулан түүгээрээ бид өнгөөр солихыг хүсч буй текстийг бүү хая. Бүхэл бүтэн догол мөр нь иймэрхүү харагдах болно: Энэ бол өгүүлбэрт төвлөрсөн текст юм.
- Бид дөнгөж саяхан бичсэн элементийг хэрэглэж байсан, энэ нь тусгай текстийг "дэгээ" -г CSS-д ашиглах боломжтой болгосон. Дараагийн алхам нь шинэ дүрмийг нэмэхийн тулд бидний CSS файл руу үсрэх явдал юм.
- Манай CSS файлд: add:
- .focus-text {
- өнгө: # F00;
- }
- Gg
- Энэ дүрэм нь inline элементийг өнгөөр харуулахыг зааж өгнө. Хэрэв бид баримтын текстийг хараар харуулсан өмнөх хэв маягийг агуулсан байсан бол энэ тойм хэлбэр нь span текстийг анхаарлаа төвлөрүүлж, өнгөөр ялгаатай болгодог. Бид бас энэ дүрмийг өөр хэв маягаар нэмж болох уу?
- Хуудсыг хадгал.
- Хуудасны үр дүнг харахын тулд хуудсан дээрх дуртай вэб хөтчөөрөө шалга.
- Зарим вэбсайтуудаас гадна, зарим вэб мэргэжилтнүүд эсвэл хос хосолсон бусад элементүүдийг ашиглахыг сонгохыг анхаарна уу. Эдгээр тэмдэглэгээнүүд нь "зоримог", "налуу" зориулалттай байсан боловч хуучирсан, солигдсон, солигдсон байна. Товчлуурууд нь орчин үеийн хөтөч дээр ажилладаг боловч маш олон вэб хөгжүүлэгчид эдгээрийг интерфэйс хэлбэрээр ашигладаг. Энэ нь хамгийн муу арга биш, гэхдээ хуучирсан элементүүдээс зайлсхийхийг хүсч байгаа бол эдгээр төрлийн загварын хэрэгцээнд зориулсан шошготой байхыг зөвлөж байна.
Үзлэгүүд болон зүйлсийг ажиглах
Хэдийгээр энэ арга нь жижиг загварын хэрэгцээнд зориулж сайн ажиллаж байгаа боловч, та дөнгөж нэг жижиг текстийг баримт бичигт өөрчлөх шаардлагатай бол энэ нь хяналтаас гарч болно. Хэрэв та хуудсаа доторх элементүүдээр дүүргэж байгаа бол бүгдийг нь CSS файлдаа ашигладаг өвөрмөц ангитай байдаг бол та үүнийг буруу хийсээр байж магадгүй. Та хуудсан дээрх эдгээр тэмдэгүүдийн ихэнхийг санах хэрэгтэй. Тэрхүү хуудсыг цааш үргэлжлүүлэх нь магадгүй юм. Үүнээс гадна, вэб сайтын сайн хэлбэр нь олон янзын өнгө, гэх мэт хуудсуудаараа ховор байдаг!