Kā ievietot CSS failu HTML

Autors: Eric Farmer
Radīšanas Datums: 3 Martā 2021
Atjaunināšanas Datums: 1 Jūlijs 2024
Anonim
Learn HTML5 and CSS3 From Scratch - Full Course
Video: Learn HTML5 and CSS3 From Scratch - Full Course

Saturs

Hiperteksta iezīmēšanas valoda (HTML) nosaka, kādi elementi atrodas tīmekļa lapā. Kaskādes stila lapu (CSS) programmēšanas valoda apraksta, kā šiem elementiem vajadzētu izskatīties.CSS failu var pievienot HTML kā ārēju (CSS pievieno kā atsevišķu failu) vai iekšēju stila lapu (CSS ir iekļauts HTML failā). Uzziniet, kā iegult CSS HTML failā, lai pārveidotu savu vietni.

Soļi

1. metode no 2: ārējās stila lapas iestatīšana

  1. 1 Izveidojiet CSS failu. Sagatavojiet un saglabājiet CSS failu ar paplašinājumu ".css".
  2. 2 Augšupielādējiet CSS failu savā vietnē.
  3. 3 Kopējiet CSS faila adresi (URL). Vietnes adrese izskatīsies apmēram šādi: www.jūsu vietne.com/stylesheet.css.
    • Laba prakse ir noņemt primāro domēna nosaukumu no URL. Pamatojoties uz to, adrese http: //myisite.com/css/default.css tiks saīsināta līdz "/css/default.css". Neaizmirstiet iekļaut slīpsvītru ("/"). To sauc par relatīvo ceļu.
  4. 4 Ievietojiet saiti failā. Atrodiet tagu / head> savā HTML failā un izveidojiet tukšu rindu tieši virs tā. Ielīmējiet šajā rindā LINK rel = stylesheet type = "text / css" href = "www.your_site.com / stylesheet.css">, aizstājot "www.your ..." ar saiti CSS failā.
  5. 5 Saglabājiet HTML failu un augšupielādējiet to vietnē.
  6. 6 Pārliecinieties, ka viss vietnē izskatās tā, kā tam vajadzētu būt. Pretējā gadījumā atkārtoti atveriet HTML failu, meklējiet kļūdas un veiciet izmaiņas.

2. metode no 2: kā ievietot iekšējo stila lapu

  1. 1 Izveidojiet etiķetes stilu>. Atveriet HTML failu un atrodiet tagu / head>. Virs tā pievienojiet dažas tukšas rindas un ievadiet:

STILA tips = "text / css"> / STYLE>

  1. 1 Ielīmējiet visu savu CSS starp šīm divām iezīmēm.
  2. 2 Saglabājiet HTML failu (ar paplašinājumu .html).
  3. 3 Pārliecinieties, ka viss vietnē izskatās tā, kā tam vajadzētu būt. Pretējā gadījumā veiciet vēlamās izmaiņas.

Padomi

  • Vienmēr pārbaudiet vietnes izskatu dažādās pārlūkprogrammās un dažādās operētājsistēmās. Dažas pārlūkprogrammas savienojas ar CSS nedaudz savādāk. Tas var notikt pat vienā pārlūkprogrammā, bet dažādās Mac un Windows versijās. Ja jūsu vietne citā pārlūkprogrammā izskatās citādi (piemēram, atstarpe starp dažiem objektiem, piemēram, sarakstiem, ir dažāda lieluma), problēma ir pārlūkprogrammas iestatījumos. Atrodiet galveno stilu lapu un ielīmējiet to CSS faila augšdaļā, lai mainītu pārlūka noklusējuma iestatījumus. Tas tiek darīts tā, lai jūsu iestatījumi neko nemainītu pašā pārlūkprogrammā.
  • Ja iespējams, ievietojiet ārēju stila lapu. Tas ļaus jums mainīt vietnes izskatu, mainot avota faila kodu. Tādā veidā jums nav jāmaina CSS katrā vietnes lapā.
  • Ja jūsu vietne nereaģē uz CSS, kā gaidīts, vēlreiz pārbaudiet visu kodējumu, lai pārliecinātos, ka tas ir uzrakstīts pareizi. Īpaši pievērsiet uzmanību semikoliem (";") un noslēguma iekavām ("}"). CSS failā ir diezgan viegli izlaist vienu no šīm rakstzīmēm.
  • Saglabājiet HTML failu savā datorā, lai vēlāk to varētu atvērt dažādās tīmekļa pārlūkprogrammās un pirms turpmākas lejupielādes vēlreiz pārbaudiet tā izskatu. Bet, lai to ielādētu, CSS fails ir jāievieto HTML kā ārēja stila lapa.
  • Ja stila lapa ir pretrunā ar sevi - piemēram, vispirms ir teikts, ka teksts būs zils un pēc tam sarkans - pēdējais nosacījums vienmēr būs izpildīts. Ja viena komanda ir ārēja stila lapa, bet otra - iekšējā stila lapa, iekšējā stila lapa būs aktīva.

Brīdinājumi

  • Nelietojiet “atvērtu” pakāpenisku CSS, tas ir, CSS, kas ir iekļauts HTML tagā. (Piemērs: "align = 'center'" ir atvērts CSS iestatījums). Šī ir novecojusi opcija ar sliktu sintaksi. Ja pēc kāda laika jums būs jāatjaunina vietne, šo iestatījumu būs grūti mainīt.