உள்ளடக்க சந்தைப்படுத்தல்

பிளாகர்: உங்கள் வலைப்பதிவில் குறியீட்டிற்கான CSS ஸ்டைல்

பிளாகர் உள்ளீட்டில் குறியீடு பகுதிகளை எப்படி உருவாக்கினேன் என்று ஒரு நண்பர் என்னிடம் கேட்டார். எனது பிளாகர் டெம்ப்ளேட்டில் CSSக்கான ஸ்டைல் ​​டேக்கைப் பயன்படுத்தி இதைச் செய்தேன். நான் சேர்த்தது இதோ:

p.code {
    font-family: Courier New;
    font-size: 8pt;
    border-style: inset;
    border-width: 3px;
    padding: 5px;
    background-color: #FFFFFF;
    line-height: 100%;
    margin: 10px;
}
  1. p.code: இது HTML ஐ குறிவைக்கும் CSS விதி <p> "குறியீடு" என்ற வர்க்கப் பெயரைக் கொண்ட கூறுகள் இந்த வகுப்பின் எந்தப் பத்தியும் பின்வரும் பண்புகளின்படி வடிவமைக்கப்படும்.
  2. font-family: Courier New;: இந்த சொத்து எழுத்துரு குடும்பத்தை "கூரியர் நியூ" ஆக அமைக்கிறது. இலக்கிடப்பட்ட உறுப்புகளுக்குள் உரைக்கு பயன்படுத்தப்படும் எழுத்துருவை இது குறிப்பிடுகிறது.
  3. font-size: 8pt;: இந்த பண்பு எழுத்துரு அளவை 8 புள்ளிகளாக அமைக்கிறது. இலக்கிடப்பட்ட உறுப்புகளில் உள்ள உரை இந்த எழுத்துரு அளவில் காட்டப்படும்.
  4. border-style: inset;: இந்த சொத்து எல்லை பாணியை "உள்செட்" என அமைக்கிறது. இது இலக்கு உறுப்புகளைச் சுற்றியுள்ள எல்லைக்கு மூழ்கிய அல்லது அழுத்தப்பட்ட தோற்றத்தை உருவாக்குகிறது.
  5. border-width: 3px;: இந்த பண்பு பார்டர் அகலத்தை 3 பிக்சல்களாக அமைக்கிறது. உறுப்புகளைச் சுற்றியுள்ள பார்டர் 3 பிக்சல்கள் தடிமனாக இருக்கும்.
  6. padding: 5px;: இந்த பண்பு இலக்கு உறுப்புகளுக்குள் உள்ள உள்ளடக்கத்தைச் சுற்றி 5 பிக்சல்கள் திணிப்பைச் சேர்க்கிறது. இது உரைக்கும் எல்லைக்கும் இடையே இடைவெளியை வழங்குகிறது.
  7. background-color: #FFFFFF;: இந்த பண்பு பின்னணி நிறத்தை வெள்ளை நிறமாக அமைக்கிறது (#FFFFFF). இலக்கு உறுப்புகளுக்குள் உள்ள உள்ளடக்கம் வெள்ளை பின்னணியைக் கொண்டிருக்கும்.
  8. line-height: 100%;: இந்த பண்பு வரியின் உயரத்தை எழுத்துரு அளவின் 100% ஆக அமைக்கிறது. எழுத்துரு அளவுக்கேற்ப உரை வரிகள் இடைவெளியில் இருப்பதை இது உறுதி செய்கிறது.
  9. margin: 10px;: இந்த பண்பு முழு உறுப்பையும் சுற்றி 10 பிக்சல்களின் விளிம்பைச் சேர்க்கிறது. இது இந்த உறுப்புக்கும் பக்கத்தில் உள்ள பிற உறுப்புகளுக்கும் இடையே இடைவெளியை வழங்குகிறது.

வழங்கப்பட்ட CSS குறியீடு HTML பத்திகளுக்கான பாணியை "குறியீடு" வகுப்பைக் கொண்டு வரையறுக்கிறது. இந்த பத்திகளுக்கான எழுத்துரு, எழுத்துரு அளவு, பார்டர் ஸ்டைல், பார்டர் அகலம், திணிப்பு, பின்னணி நிறம், கோட்டின் உயரம் மற்றும் விளிம்பு ஆகியவற்றை இது அமைக்கிறது. பிளாகர் இடுகையில் உள்ள குறியீடு துணுக்குகள் அல்லது முன் வடிவமைத்த உரைக்கு குறிப்பிட்ட தோற்றத்தை அளிக்க இந்த பாணியைப் பயன்படுத்தலாம்.

இது எப்படி இருக்கும் என்பது இங்கே:

p.code {
எழுத்துரு குடும்பம்: கூரியர் புதியது;
எழுத்துரு அளவு: 8pt;
எல்லை-பாணி: உள்ளீடு;
எல்லை அகலம்: 3px;
திணிப்பு: 5px;
பின்னணி நிறம்: #FFFFFF;
வரி உயரம்: 100%;
விளிம்பு: 10px;
}

இனிய குறியீட்டு முறை!

Douglas Karr

Douglas Karr இன் CMO ஆகும் ஓபன் இன்சைட்ஸ் மற்றும் நிறுவனர் Martech Zone. டக்ளஸ் டஜன் கணக்கான வெற்றிகரமான மார்டெக் ஸ்டார்ட்அப்களுக்கு உதவியிருக்கிறார், மார்டெக் கையகப்படுத்துதல்கள் மற்றும் முதலீடுகளில் $5 பில்லுக்கும் மேலான விடாமுயற்சியில் உதவியிருக்கிறார், மேலும் நிறுவனங்களின் விற்பனை மற்றும் சந்தைப்படுத்தல் உத்திகளை செயல்படுத்தி தானியக்கமாக்குவதில் நிறுவனங்களுக்கு தொடர்ந்து உதவுகிறார். டக்ளஸ் சர்வதேச அளவில் அங்கீகரிக்கப்பட்ட டிஜிட்டல் மாற்றம் மற்றும் MarTech நிபுணர் மற்றும் பேச்சாளர். டக்ளஸ் டம்மியின் வழிகாட்டி மற்றும் வணிகத் தலைமைப் புத்தகத்தின் வெளியிடப்பட்ட ஆசிரியர் ஆவார்.

தொடர்புடைய கட்டுரைகள்

மேலே பட்டன் மேல்
நெருக்கமான

Adblock கண்டறியப்பட்டது

Martech Zone விளம்பர வருவாய், துணை இணைப்புகள் மற்றும் ஸ்பான்சர்ஷிப்கள் மூலம் எங்கள் தளத்தில் நாங்கள் பணமாக்குவதால், இந்த உள்ளடக்கத்தை உங்களுக்கு எந்த கட்டணமும் இல்லாமல் வழங்க முடியும். எங்கள் தளத்தைப் பார்க்கும்போது உங்கள் விளம்பரத் தடுப்பானை அகற்றினால் நாங்கள் பாராட்டுவோம்.