Your Ads For Post In Here
MultiTabs Syntax Highlighter
your code in here
your code in here
Your Code In here
Writing Code:
<div class='pre tb'>
<!--[ Active function ]-->
<input class='prei hidden' id='preT-1' type='radio' name='preTab' checked>
<input class='prei hidden' id='preT-2' type='radio' name='preTab'>
<input class='prei hidden' id='preT-3' type='radio' name='preTab'>
<!--[ Header/title ]-->
<div class='preH tbHd scrlH'>
<!--[ Change atribute data-text='...' to replace title ]-->
<label for='preT-1' data-text='HTML'></label>
<label for='preT-2' data-text='CSS'></label>
<label for='preT-3' data-text='JS'></label>
</div>
<!--[ Content ]-->
<div class='preC-1'>
<pre>Your_code_is_here</pre>
</div>
<div class='preC-2'>
<pre>Your_code_is_here</pre>
</div>
<div class='preC-3'>
<pre>Your_code_is_here</pre>
</div>
</div>
- The
checkedattribute defines the first tab that appears by default. - Make sure
id='...'andfor='...'attributes have the same value. ID must be unique, there cannot be two identical IDs in one page. - Change
data-text='HTML'attribute in the highlighted section to rename the tab.
Your Tabs 1 here
Your Tabs 2 here
Your Tabs 3 here
Your Tabs 4 here
Writing Code:
<!--[ Active function ]-->
<input class="tbIn hidden" id="fTabs-1" type="radio" name="postTabs" checked="">
<input class="tbIn hidden" id="fTabs-2" type="radio" name="postTabs">
<input class="tbIn hidden" id="fTabs-3" type="radio" name="postTabs">
<input class="tbIn hidden" id="fTabs-4" type="radio" name="postTabs">
<!--[ Tabs header/title, replace class attribute to class='tbHd scrlH stick' if you want to create a floating tab title ]-->
<div class="tbHd scrlH">
<!--[ Change atribute data-text='...' to replace tabs title ]-->
<label for="fTabs-1" data-text="Tabs 1"></label>
<label for="fTabs-2" data-text="Tabs 2"></label>
<label for="fTabs-3" data-text="Tabs 3"></label>
<label for="fTabs-4" data-text="Tabs 4"></label>
</div>
<div class="tbCn">
<!--[ Tabs content ]-->
<div class="tbText-1">
<p>Your Tabs 1 here</p>
</div>
<!--[ Tabs content ]-->
<div class="tbText-2">
<p>Your Tabs 2 here</p>
</div>
<!--[ Tabs content ]-->
<div class="tbText-3">
<p>Your Tabs 3 here</p>
</div>
<!--[ Tabs content ]-->
<div class="tbText-4">
<p>Your Tabs 4 here</p>
</div>
</div>
Your Ads For Post In Here
image quote pre code