HTML இல் CSS கோப்பை எவ்வாறு செருகுவது

நூலாசிரியர்: Eric Farmer
உருவாக்கிய தேதி: 3 மார்ச் 2021
புதுப்பிப்பு தேதி: 1 ஜூலை 2024
Anonim
CSS கோப்பை HTML கோப்புடன் இணைப்பது எப்படி [இணையப் பயிற்சி]
காணொளி: CSS கோப்பை HTML கோப்புடன் இணைப்பது எப்படி [இணையப் பயிற்சி]

உள்ளடக்கம்

ஹைபர்டெக்ஸ்ட் மார்க்அப் மொழி (HTML) ஒரு வலைப்பக்கத்தில் என்ன கூறுகள் உள்ளன என்பதை தீர்மானிக்கிறது. கேஸ்கேடிங் ஸ்டைல் ​​ஷீட்ஸ் (சிஎஸ்எஸ்) நிரலாக்க மொழி இந்த கூறுகள் எப்படி இருக்க வேண்டும் என்பதை விவரிக்கிறது.CSS கோப்பை HTML இல் வெளிப்புறமாக (CSS தனி கோப்பாக சேர்க்கப்பட்டுள்ளது) அல்லது உள் பாணி தாள் (CSS HTML கோப்பில் சேர்க்கப்பட்டுள்ளது) ஆக சேர்க்கலாம். உங்கள் தளத்தை மறுவடிவமைக்க ஒரு HTML கோப்பில் CSS ஐ உட்பொதிப்பது எப்படி என்பதை அறிக.

படிகள்

முறை 2 இல் 1: வெளிப்புற பாணி தாளை எவ்வாறு அமைப்பது

  1. 1 ஒரு CSS கோப்பை உருவாக்கவும். ".Css" நீட்டிப்புடன் ஒரு CSS கோப்பை தயார் செய்து சேமிக்கவும்.
  2. 2 CSS கோப்பை உங்கள் தளத்தில் பதிவேற்றவும்.
  3. 3 CSS கோப்பின் முகவரியை (URL) நகலெடுக்கவும். தள முகவரி இப்படி இருக்கும்: www.yoursite.com/stylesheet.css.
    • URL இலிருந்து முதன்மை டொமைன் பெயரை நீக்குவது நல்லது. இதன் அடிப்படையில், முகவரி http: //myisite.com/css/default.css "/css/default.css" என்று சுருக்கப்படும். முன்னணி சாய்வை ("/") சேர்க்க நினைவில் கொள்ளுங்கள். இது உறவினர் பாதை என்று அழைக்கப்படுகிறது.
  4. 4 கோப்பில் இணைப்பைச் செருகவும். உங்கள் HTML கோப்பில் / தலை> குறிச்சொல்லைக் கண்டறிந்து அதற்கு மேலே ஒரு வெற்று வரியை உருவாக்கவும். அந்த வரியில் ஒட்டவும் LINK rel = ஸ்டைல்ஷீட் வகை = "text / css" href = "www.your_site.com / stylesheet.css">, "www.your ..." க்கு பதிலாக CSS கோப்பில் இணைப்பை இணைக்கவும்.
  5. 5 HTML கோப்பை சேமித்து அதை தளத்தில் பதிவேற்றவும்.
  6. 6 தளத்தில் உள்ள அனைத்தும் சரியாக இருக்க வேண்டும் என்பதை உறுதிப்படுத்தவும். இல்லையெனில், HTML கோப்பை மீண்டும் திறக்கவும், பிழைகளைப் பார்க்கவும் மற்றும் மாற்றங்களைச் செய்யவும்.

2 இன் முறை 2: ஒரு உள் பாணி தாளை எவ்வாறு செருகுவது

  1. 1 ஒரு லேபிள் பாணியை உருவாக்கவும்>. HTML கோப்பைத் திறந்து / தலை> குறிச்சொல்லைக் கண்டறியவும். அதற்கு மேலே சில வெற்று வரிகளைச் சேர்த்து பின்வருவனவற்றை உள்ளிடவும்:

பாணி வகை = "உரை / சிஎஸ்எஸ்"> / பாணி>

  1. 1 இந்த இரண்டு லேபிள்களுக்கு இடையில் உங்கள் CSS ஐ ஒட்டவும்.
  2. 2 HTML கோப்பை சேமிக்கவும் (.html நீட்டிப்புடன்).
  3. 3 தளத்தில் உள்ள அனைத்தும் சரியாக இருக்க வேண்டும் என்பதை உறுதிப்படுத்தவும். இல்லையெனில், விரும்பிய மாற்றங்களைச் செய்யுங்கள்.

குறிப்புகள்

  • வெவ்வேறு உலாவிகளில் மற்றும் வெவ்வேறு இயக்க முறைமைகளில் தளத்தின் தோற்றத்தை எப்போதும் சரிபார்க்கவும். சில உலாவிகள் CSS உடன் சற்று வித்தியாசமான வழிகளில் இணைகின்றன. இது ஒரே உலாவியில் கூட நடக்கலாம், ஆனால் மேக் மற்றும் விண்டோஸின் வெவ்வேறு பதிப்புகளில். உங்கள் தளம் வேறொரு உலாவியில் வித்தியாசமாகத் தோன்றினால் (எடுத்துக்காட்டாக, சில பொருள்களுக்கு இடையிலான இடைவெளி, பட்டியல்கள் போன்றவை வேறு அளவுடையவை), உலாவியின் அமைப்புகளில் சிக்கல் உள்ளது இயல்புநிலை உலாவி அமைப்புகளை மாற்ற மாஸ்டர் ஸ்டைல்ஷீட்டை கண்டுபிடித்து CSS கோப்பின் மேல் ஒட்டவும். உலாவியில் உங்கள் அமைப்புகள் எதையும் மாற்றாமல் இருக்க இது செய்யப்படுகிறது.
  • உங்களால் முடிந்தால் வெளிப்புற பாணி தாளைச் செருகவும். மூலக் கோப்பில் குறியீட்டை மாற்றுவதன் மூலம் தளத்தின் தோற்றத்தை மாற்ற இது உங்களை அனுமதிக்கும். இந்த வழியில் நீங்கள் உங்கள் தளத்தின் ஒவ்வொரு பக்கத்திலும் CSS ஐ மாற்ற வேண்டியதில்லை.
  • நீங்கள் எதிர்பார்க்கும் விதத்தில் உங்கள் தளம் CSS க்கு பதிலளிக்கவில்லை என்றால், முழு குறியாக்கத்தையும் இருமுறை சரிபார்த்து அது சரியாக உச்சரிக்கப்பட்டுள்ளதா என்பதை உறுதிப்படுத்தவும். குறிப்பாக, அரைப்புள்ளிகள் (";") மற்றும் அடைப்புக்குறிக்குள் ("}") சிறப்பு கவனம் செலுத்துங்கள். CSS கோப்பில் இந்த எழுத்துக்களில் ஒன்றைத் தவிர்ப்பது மிகவும் எளிது.
  • HTML கோப்பை உங்கள் கணினியில் சேமிக்கவும், இதன் மூலம் நீங்கள் அதை பல்வேறு இணைய உலாவிகளில் திறக்கலாம் மேலும் பதிவிறக்குவதற்கு முன் அதன் தோற்றத்தை இருமுறை சரிபார்க்கவும். ஆனால் அதை ஏற்றுவதற்கு, CSS கோப்பு HTML இல் ஒரு வெளிப்புற பாணியாக செருகப்பட வேண்டும்.
  • ஸ்டைல் ​​ஷீட் தனக்கு முரணாக இருந்தால் - உதாரணமாக, அது முதலில் உரை நீலமாகவும் பின்னர் சிவப்பு நிறமாகவும் இருக்கும் என்று கூறுகிறது - கடைசி நிபந்தனை எப்போதும் பூர்த்தி செய்யப்படும். ஒரு கட்டளை வெளிப்புற பாணி தாள் மற்றும் மற்றொன்று உள் பாணி தாள் என்றால், உள் பாணி தாள் செயலில் இருக்கும்.

எச்சரிக்கைகள்

  • "திறந்த" ஸ்டேஜிங் CSS ஐப் பயன்படுத்த வேண்டாம், அதாவது HTML டேக்கில் சேர்க்கப்பட்டுள்ள CSS. (எடுத்துக்காட்டு: "align = 'centre'" என்பது ஒரு திறந்த CSS அமைப்பாகும்). மோசமான தொடரியல் கொண்ட இது வழக்கற்றுப் போன விருப்பமாகும். சிறிது நேரம் கழித்து நீங்கள் தளத்தைப் புதுப்பிக்க வேண்டும் என்றால், இந்த அமைப்பை மாற்றுவது கடினம்.