CSS NAVIGATION MENU K

Free CSS NAVIGATION MENU K

These eleven CSS navigation menus are created using the Sliding Doors technique, and will even work in everyone’s favorite browser Internet Explorer. You may download the entire set and use any way you see fit. You may want to clean up the stylesheet, or alter the menu graphics to suit your needs. All the menus can be used for commercial or private use.
Do you like? in this blog have all!

*CODE*

/*- Menu Tabs K--------------------------- */ #tabsK { float:left; width:100%; background:#E7E5E2; font-size:93%; line-height:normal; border-bottom:1px solid #54545C; } #tabsK ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabsK li { display:inline; margin:0; padding:0; } #tabsK a { float:left; background:url("http://exploding-boy.com/images/cssmenus/tableftK.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabsK a span { float:left; display:block; background:url("http://exploding-boy.com/images/cssmenus/tabrightK.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabsK a span {float:none;} /* End IE5-Mac hack */ #tabsK a:hover span { color:#FFF; background-position:100% -42px; } #tabsK a:hover { background-position:0% -42px; } #tabsK a:hover span { background-position:100% -42px; }

How to install:

1. Login to your Blogger account of course.
សូមចូលក្នុង account របស់អ្នក

2. Go to your HTML Editor on your blogger dashboard.
បន្ទាប់មកចូលក្នុង HTML Editor

3. Tick the Expand Widget Template
ចូរចុចធិចយក ត្រង់ Expand Widget Template
4-Coppy this code into HTML that have like #
លោកអ្នកអាច​ចម្លងកូដនេះ​ទៅដាក់ក្នុង HTML ដែលមាននិមិត្ត​សញ្ញាបែបនេះ #


and then to write in your sidebar widget with Java script like this:
ហើយបន្ទាប់មកចូលទៅសរសេរនៅក្នុង sidebar widget ដោយយកប្រភេទ Java script ហើយសរសេរដូច្នេះ៖

<h2>Tab Menu K</h2> <div id="tabsK"> <ul> <li><a href="#" title="Link 1"><span>Link 1</span></a></li> <li><a href="#" title="Link 2"><span>Link 2</span></a></li> <li><a href="#" title="Link 3"><span>Link 3</span></a></li> <li><a href="#" title="Longer Link Text"><span>Longer Link Text</span></a></li> <li><a href="#" title="Link 7"><span>Link 7</span></a></li> </ul> </div> <br /><br />

CSS NAVIGATION MENU I

Free CSS NAVIGATION MENU I

These eleven CSS navigation menus are created using the Sliding Doors technique, and will even work in everyone’s favorite browser Internet Explorer. You may download the entire set and use any way you see fit. You may want to clean up the stylesheet, or alter the menu graphics to suit your needs. All the menus can be used for commercial or private use.
Do you like? in this blog have all!

*CODE*

/*- Menu Tabs I--------------------------- */

#tabsI {
float:left;
width:100%;
background:#EFF4FA;
font-size:93%;
line-height:normal;
border-bottom:1px solid #DD740B;
}
#tabsI ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#tabsI li {
display:inline;
margin:0;
padding:0;
}
#tabsI a {
float:left;
background:url("http://exploding-boy.com/images/cssmenus/tableftI.gif") no-repeat left top;
margin:0;
padding:0 0 0 5px;
text-decoration:none;
}
#tabsI a span {
float:left;
display:block;
background:url("http://exploding-boy.com/images/cssmenus/tabrightI.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#FFF;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabsI a span {float:none;}
/* End IE5-Mac hack */
#tabsI a:hover span {
color:#FFF;
}
#tabsI a:hover {
background-position:0% -42px;
}
#tabsI a:hover span {
background-position:100% -42px;
}

How to install:

1. Login to your Blogger account of course.
សូមចូលក្នុង account របស់អ្នក

2. Go to your HTML Editor on your blogger dashboard.
បន្ទាប់មកចូលក្នុង HTML Editor

3. Tick the Expand Widget Template
ចូរចុចធិចយក ត្រង់ Expand Widget Template
4-Coppy this code into HTML that have like #
លោកអ្នកអាច​ចម្លងកូដនេះ​ទៅដាក់ក្នុង HTML ដែលមាននិមិត្ត​សញ្ញាបែបនេះ #


and then to write in your sidebar widget with Java script like this:
ហើយបន្ទាប់មកចូលទៅសរសេរនៅក្នុង sidebar widget ដោយយកប្រភេទ Java script ហើយសរសេរដូច្នេះ៖

<h2>Tab Menu I</h2>
<div id="tabsI">
<ul>
<li><a href="#" title="Link 1"><span>Link 1</span></a></li>

<li><a href="#" title="Link 2"><span>Link 2</span></a></li>
<li><a href="#" title="Link 3"><span>Link 3</span></a></li>
<li><a href="#" title="Longer Link Text"><span>Longer Link Text</span></a></li>
<li><a href="#" title="Link 7"><span>Link 7</span></a></li>

</ul>
</div>
<br /><br />

CSS NAVIGATION MENU J

Free CSS NAVIGATION MENU J

These eleven CSS navigation menus are created using the Sliding Doors technique, and will even work in everyone’s favorite browser Internet Explorer. You may download the entire set and use any way you see fit. You may want to clean up the stylesheet, or alter the menu graphics to suit your needs. All the menus can be used for commercial or private use.
Do you like? in this blog have all!

*CODE*

/*- Menu Tabs J--------------------------- */

#tabsJ {
float:left;
width:100%;
background:#F4F4F4;
font-size:93%;
line-height:normal;
border-bottom:1px solid #24618E;
}
#tabsJ ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#tabsJ li {
display:inline;
margin:0;
padding:0;
}
#tabsJ a {
float:left;
background:url("http://exploding-boy.com/images/cssmenus/tableftJ.gif") no-repeat left top;
margin:0;
padding:0 0 0 5px;
text-decoration:none;
}
#tabsJ a span {
float:left;
display:block;
background:url("http://exploding-boy.com/images/cssmenus/tabrightJ.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#24618E;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabsJ a span {float:none;}
/* End IE5-Mac hack */
#tabsJ a:hover span {
color:#FFF;
}
#tabsJ a:hover {
background-position:0% -42px;
}
#tabsJ a:hover span {
background-position:100% -42px;
}

How to install:

1. Login to your Blogger account of course.
សូមចូលក្នុង account របស់អ្នក

2. Go to your HTML Editor on your blogger dashboard.
បន្ទាប់មកចូលក្នុង HTML Editor

3. Tick the Expand Widget Template
ចូរចុចធិចយក ត្រង់ Expand Widget Template
4-Coppy this code into HTML that have like #
លោកអ្នកអាច​ចម្លងកូដនេះ​ទៅដាក់ក្នុង HTML ដែលមាននិមិត្ត​សញ្ញាបែបនេះ #


and then to write in your sidebar widget with Java script like this:
ហើយបន្ទាប់មកចូលទៅសរសេរនៅក្នុង sidebar widget ដោយយកប្រភេទ Java script ហើយសរសេរដូច្នេះ៖

<h2>Tab Menu J</h2>
<div id="tabsJ">
<ul>
<li><a href="#" title="Link 1"><span>Link 1</span></a></li>

<li><a href="#" title="Link 2"><span>Link 2</span></a></li>
<li><a href="#" title="Link 3"><span>Link 3</span></a></li>
<li><a href="#" title="Longer Link Text"><span>Longer Link Text</span></a></li>
<li><a href="#" title="Link 7"><span>Link 7</span></a></li>

</ul>
</div>
<br /><br />

CSS NAVIGATION MENU G

Free CSS NAVIGATION MENU G

These eleven CSS navigation menus are created using the Sliding Doors technique, and will even work in everyone’s favorite browser Internet Explorer. You may download the entire set and use any way you see fit. You may want to clean up the stylesheet, or alter the menu graphics to suit your needs. All the menus can be used for commercial or private use.
Do you like? in this blog have all!

*CODE*

/*- Menu Tabs G--------------------------- */

#tabsG {
float:left;
width:100%;
background:#666;
font-size:93%;
line-height:normal;
}
#tabsG ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#tabsG li {
display:inline;
margin:0;
padding:0;
}
#tabsG a {
float:left;
background:url("http://exploding-boy.com/images/cssmenus/tableftG.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabsG a span {
float:left;
display:block;
background:url("http://exploding-boy.com/images/cssmenus/tabrightG.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#FFF;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabsG a span {float:none;}
/* End IE5-Mac hack */
#tabsG a:hover span {
color:#FFF;
}
#tabsG a:hover {
background-position:0% -42px;
}
#tabsG a:hover span {
background-position:100% -42px;
}

How to install:

1. Login to your Blogger account of course.
សូមចូលក្នុង account របស់អ្នក

2. Go to your HTML Editor on your blogger dashboard.
បន្ទាប់មកចូលក្នុង HTML Editor

3. Tick the Expand Widget Template
ចូរចុចធិចយក ត្រង់ Expand Widget Template
4-Coppy this code into HTML that have like #
លោកអ្នកអាច​ចម្លងកូដនេះ​ទៅដាក់ក្នុង HTML ដែលមាននិមិត្ត​សញ្ញាបែបនេះ #


and then to write in your sidebar widget with Java script like this:
ហើយបន្ទាប់មកចូលទៅសរសេរនៅក្នុង sidebar widget ដោយយកប្រភេទ Java script ហើយសរសេរដូច្នេះ៖

<h2>Tab Menu G</h2>
<div id="tabsG">
<ul>
<li><a href="#" title="Link 1"><span>Link 1</span></a></li>

<li><a href="#" title="Link 2"><span>Link 2</span></a></li>
<li><a href="#" title="Link 3"><span>Link 3</span></a></li>
<li><a href="#" title="Longer Link Text"><span>Longer Link Text</span></a></li>
<li><a href="#" title="Link 7"><span>Link 7</span></a></li>

</ul>
</div>
<br /><br />

CSS NAVIGATION MENU F

Free CSS NAVIGATION MENU F

These eleven CSS navigation menus are created using the Sliding Doors technique, and will even work in everyone’s favorite browser Internet Explorer. You may download the entire set and use any way you see fit. You may want to clean up the stylesheet, or alter the menu graphics to suit your needs. All the menus can be used for commercial or private use.
Do you like? in this blog have all!

*CODE*

/*- Menu Tabs F--------------------------- */ #tabsF { float:left; width:100%; background:#efefef; font-size:93%; line-height:normal; border-bottom:1px solid #666; } #tabsF ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabsF li { display:inline; margin:0; padding:0; } #tabsF a { float:left; background:url("http://exploding-boy.com/images/cssmenus/tableftF.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabsF a span { float:left; display:block; background:url("http://exploding-boy.com/images/cssmenus/tabrightF.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#666; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabsF a span {float:none;} /* End IE5-Mac hack */ #tabsF a:hover span { color:#FFF; } #tabsF a:hover { background-position:0% -42px; } #tabsF a:hover span { background-position:100% -42px; }

How to install:

1. Login to your Blogger account of course.
សូមចូលក្នុង account របស់អ្នក

2. Go to your HTML Editor on your blogger dashboard.
បន្ទាប់មកចូលក្នុង HTML Editor

3. Tick the Expand Widget Template
ចូរចុចធិចយក ត្រង់ Expand Widget Template
4-Coppy this code into HTML that have like #
លោកអ្នកអាច​ចម្លងកូដនេះ​ទៅដាក់ក្នុង HTML ដែលមាននិមិត្ត​សញ្ញាបែបនេះ #


and then to write in your sidebar widget with Java script like this:
ហើយបន្ទាប់មកចូលទៅសរសេរនៅក្នុង sidebar widget ដោយយកប្រភេទ Java script ហើយសរសេរដូច្នេះ៖

<h2>Tab Menu F</h2> <div id="tabsF"> <ul> <li><a href="#" title="Link 1"><span>Link 1</span></a></li> <li><a href="#" title="Link 2"><span>Link 2</span></a></li> <li><a href="#" title="Link 3"><span>Link 3</span></a></li> <li><a href="#" title="Longer Link Text"><span>Longer Link Text</span></a></li> <li><a href="#" title="Link 7"><span>Link 7</span></a></li> </ul> </div> <br /><br />

CSS NAVIGATION MENU D

Free CSS NAVIGATION MENU D

These eleven CSS navigation menus are created using the Sliding Doors technique, and will even work in everyone’s favorite browser Internet Explorer. You may download the entire set and use any way you see fit. You may want to clean up the stylesheet, or alter the menu graphics to suit your needs. All the menus can be used for commercial or private use.
Do you like? in this blog have all!

*CODE*

/*- Menu Tabs D--------------------------- */ #tabsD { float:left; width:100%; background:#FCF3F8; font-size:93%; line-height:normal; border-bottom:1px solid #F4B7D6; } #tabsD ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabsD li { display:inline; margin:0; padding:0; } #tabsD a { float:left; background:url("http://exploding-boy.com/images/cssmenus/tableftD.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabsD a span { float:left; display:block; background:url("http://exploding-boy.com/images/cssmenus/tabrightD.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#C7377D; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabsD a span {float:none;} /* End IE5-Mac hack */ #tabsD a:hover span { color:#C7377D; } #tabsD a:hover { background-position:0% -42px; } #tabsD a:hover span { background-position:100% -42px; }

How to install:

1. Login to your Blogger account of course.
សូមចូលក្នុង account របស់អ្នក

2. Go to your HTML Editor on your blogger dashboard.
បន្ទាប់មកចូលក្នុង HTML Editor

3. Tick the Expand Widget Template
ចូរចុចធិចយក ត្រង់ Expand Widget Template
4-Coppy this code into HTML that have like #
លោកអ្នកអាច​ចម្លងកូដនេះ​ទៅដាក់ក្នុង HTML ដែលមាននិមិត្ត​សញ្ញាបែបនេះ #


and then to write in your sidebar widget with Java script like this:
ហើយបន្ទាប់មកចូលទៅសរសេរនៅក្នុង sidebar widget ដោយយកប្រភេទ Java script ហើយសរសេរដូច្នេះ៖

<h2>Tab Menu D</h2> <div id="tabsD"> <ul> <li><a href="#" title="Link 1"><span>Link 1</span></a></li> <li><a href="#" title="Link 2"><span>Link 2</span></a></li> <li><a href="#" title="Link 3"><span>Link 3</span></a></li> <li><a href="#" title="Longer Link Text"><span>Longer Link Text</span></a></li> <li><a href="#" title="Link 7"><span>Link 7</span></a></li> </ul> </div> <br /><br />

CSS NAVIGATION MENU E

Free CSS NAVIGATION MENU E

These eleven CSS navigation menus are created using the Sliding Doors technique, and will even work in everyone’s favorite browser Internet Explorer. You may download the entire set and use any way you see fit. You may want to clean up the stylesheet, or alter the menu graphics to suit your needs. All the menus can be used for commercial or private use.
Do you like? in this blog have all!

*CODE*

/*- Menu Tabs E--------------------------- */ #tabsE { float:left; width:100%; background:#000; font-size:93%; line-height:normal; } #tabsE ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabsE li { display:inline; margin:0; padding:0; } #tabsE a { float:left; background:url("http://exploding-boy.com/images/cssmenus/tableftE.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabsE a span { float:left; display:block; background:url("http://exploding-boy.com/images/cssmenus/tabrightE.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabsE a span {float:none;} /* End IE5-Mac hack */ #tabsE a:hover span { color:#FFF; } #tabsE a:hover { background-position:0% -42px; } #tabsE a:hover span { background-position:100% -42px; }

How to install:

1. Login to your Blogger account of course.
សូមចូលក្នុង account របស់អ្នក

2. Go to your HTML Editor on your blogger dashboard.
បន្ទាប់មកចូលក្នុង HTML Editor

3. Tick the Expand Widget Template
ចូរចុចធិចយក ត្រង់ Expand Widget Template
4-Coppy this code into HTML that have like #
លោកអ្នកអាច​ចម្លងកូដនេះ​ទៅដាក់ក្នុង HTML ដែលមាននិមិត្ត​សញ្ញាបែបនេះ #


and then to write in your sidebar widget with Java script like this:
ហើយបន្ទាប់មកចូលទៅសរសេរនៅក្នុង sidebar widget ដោយយកប្រភេទ Java script ហើយសរសេរដូច្នេះ៖

<h2>Tab Menu E</h2> <div id="tabsE"> <ul> <li><a href="#" title="Link 1"><span>Link 1</span></a></li> <li><a href="#" title="Link 2"><span>Link 2</span></a></li> <li><a href="#" title="Link 3"><span>Link 3</span></a></li> <li><a href="#" title="Longer Link Text"><span>Longer Link Text</span></a></li> <li><a href="#" title="Link 7"><span>Link 7</span></a></li> </ul> </div> <br /><br />