கட்டம் கட்டிக் காட்டுவது எப்படி?

என்னுடைய சில பதிவுகளில் கீழ்கண்டவாறு முக்கிய பகுதிகளைக் கட்டத்திற்குள் காட்டியிருப்பதைப் பார்த்திருக்கலாம்.

இவ்வாறு முக்கிய குறிப்புகளை எவ்வாறு கட்டம் கட்டி அடிக்கலாம் என்பதைப் பற்றி இங்கு பார்க்கலாம்.

இதைச் செய்வது மிகவும் சுலபம். நான் pre tag மூலம் இதனைச் செய்கிறேன். பதிவு எழுதும்போது Compose, Edit HTML என்ற இரு பிரிவுகள் இருக்கும். அதில் Edit HTML சென்று நமக்கு கட்டம் கட்டத் தேவையான பகுதிக்கு முன்னும் பின்னும் <pre>.... </pre> என்று குறிப்பிட்டால் போதும்.

சில டெம்ப்லேட்டுகளில் இதன் வடிவம் ஏற்கனவே பதிவு செய்யப்பட்டிருக்கும். அப்படி செய்யப்படாத டெம்ப்லேட்டுகள் வைத்திருப்பவர்கள் கீழ்கண்ட வழிமுறைகளைப் பின்பற்றவும்.

Layout -> Edit HTML சென்றால், டெம்ப்லேட்டின் HTML வடிவம் தெரியும். அதில் CSS எனப்படும் இடத்திற்குள் இந்த வடிவத்தினைப் பதிவு செய்ய வேண்டும். இதில் சிரமமிருந்தால் a { ... }, a:link { ...}, a:hover { ... } என்பவற்றிற்குக் கீழே பதிவு செய்யலாம். இதனை நமக்குத் தேவையான வடிவத்தில் வைத்துக்கொள்ளலாம்.

இதோ சில கோடுகளும் அதன் வடிவங்களும்...

pre { overflow: auto; white-space: pre-wrap; padding: 4px; margin: 4px; border: 1px solid #cecece; }

pre { overflow: auto; white-space: pre-wrap; padding: 4px; margin: 4px; border: 1px dotted #cecece; }

pre { overflow: auto; white-space: pre-wrap; padding: 4px; margin: 4px; border: 1px dashed #cecece; }

pre { overflow: auto; white-space: pre-wrap; padding: 4px; margin: 4px; background: #efefef; border: 1px dashed #cecece; background: #efefef; }

pre { overflow: auto; white-space: pre-wrap; padding: 4px; margin: 4px; background: #efefef; border:
1px solid #cecece; border-left: 4px solid #00FF00; }

pre { overflow: auto; white-space: pre-wrap; padding: 4px; margin: 4px; background: #efefef; border-left: 4px solid #00FF00; }


இதில் #cecece, #00ff00... இதெல்லாம் வண்ணத்திற்கான கோடுகள். தேவையான வண்ணத்தின் கோடுகளைப் பெற இங்கே செல்லவும் http://html-color-codes.info/#HTML_Color_Picker.

என்ன தயாரா?

-அதி பிரதாபன்.