Hi welcome
Here's how you can make bold and italic text.
Here's how you can add an image:
Here's how to make a list:
- First thing
- Second thing
- Hello
ID as selectorClass as selector
Plain HTMLWordpress
Download ZIP file
#blendedMenu *{
padding:0;
margin:0;
border:0;
list-style-type:none;
word-spacing:0px;
}
#blendedMenu{
display : inline-table;
width : 100%;
background-size : 100% 100%;
margin : 0px auto;
height : 42px;
text-align : center;
background-color : rgba(0,0,0,1);
box-shadow : 0px 0px 12px 4px rgba(0,0,255,1);
border-radius : 14px;
font-size : 0px;
}
#blendedMenu > li{
display : inherit;
position : relative;
margin-top : 5px;
margin-left : 0px;
}
#blendedMenu > li > a{
display : block;
text-decoration : none;
background-size : 100% 100%;
width : auto;
height : 34px;
font-size : 28px;
letter-spacing : 1px;
min-width : 180px;
margin : 0px;
color : rgba(0,0,255,1);
background-color : rgba(0,0,0,0);
text-align : center;
border-radius : 1px;
line-height : 35px;
font-family : 'Courier New', 'Courier New', monospace;
border-width : 0px;
border-style : solid;
border-color : rgba(0,0,0,0);
text-shadow : 1px -2px 10px rgba(0,0,255,1);
font-variant : small-caps;
font-weight : bold;
box-shadow : 0px 0px 0px 0px rgba(0,0,0,0);
}
#blendedMenu > li > ul > li > a{
display : block;
text-decoration : none;
background-size : 100% 100%;
width : auto;
height : 34px;
font-size : 28px;
letter-spacing : 1px;
min-width : 180px;
margin : 0px;
color : rgba(0,0,255,1);
background-color : rgba(0,0,0,0);
text-align : center;
border-radius : 1px;
line-height : 35px;
font-family : 'Courier New', 'Courier New', monospace;
border-width : 0px;
border-style : solid;
border-color : rgba(0,0,0,0);
text-shadow : 1px -2px 10px rgba(0,0,255,1);
font-variant : small-caps;
font-weight : bold;
box-shadow : 0px 0px 0px 0px rgba(0,0,0,0);
}
#blendedMenu > li > ul > li > ul a{
display : block;
text-decoration : none;
background-size : 100% 100%;
width : auto;
height : 34px;
font-size : 28px;
letter-spacing : 1px;
min-width : 180px;
margin : 0px;
color : rgba(0,0,255,1);
background-color : rgba(0,0,0,0);
text-align : center;
border-radius : 1px;
line-height : 35px;
font-family : 'Courier New', 'Courier New', monospace;
border-width : 0px;
border-style : solid;
border-color : rgba(0,0,0,0);
text-shadow : 1px -2px 10px rgba(0,0,255,1);
font-variant : small-caps;
font-weight : bold;
box-shadow : 0px 0px 0px 0px rgba(0,0,0,0);
}
#blendedMenu > li > ul{
display : block;
position : absolute;
z-index : 10;
visibility : hidden;
opacity : 0.1;
box-shadow : 0px 3px 12px 6px rgba(0,0,255,1);
border-radius : 14px;
left : 0px;
-webkit-transition : all 0.4s;
transition : all 0.4s;
background-color : rgba(0,0,0,1);
}
#blendedMenu > li > ul > li > ul{
display : block;
position : absolute;
z-index : 10;
visibility : hidden;
left : 230px;
opacity : 0.1;
box-shadow : 0px 3px 12px 6px rgba(0,0,255,1);
background-color : rgba(0,0,0,1);
border-radius : 14px;
margin-top : -320px;
-webkit-transition : all 0.4s;
transition : all 0.4s;
}
#blendedMenu li:hover > a{
color : rgba(255,0,0,1);
background-color : rgba(255,255,255,0);
}
#blendedMenu .active > a{
color : rgba(255,32,128,0.8);
background-color : rgba(255,255,255,0);
}
#blendedMenu > li > ul > li:hover > ul{
visibility : visible;
opacity : 1;
left : 180px;
margin-top : -34px;
}
#blendedMenu > li:hover > ul{
visibility : visible;
opacity : 1;
}
To build a HTML CSS website layout for your menu
Visit : www.Blended-HTML.com