Need help adding social media icons on the left side of the top bar on our website using html. I added this top bar using html so i wouldn't mind adding a new code with the left aligned social media icons, i have the photos so just need the code. Also, trying to add menu separators for each item and i am not sure how to do that either. Website: http://www.stephensengineering.com/stephens33/ thanks in advance for your help!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Horizontal Navigation Bar w/Rollover Effect</title>
<style type="text/css">
<!--
#navbar ul {
margin: 0;
padding: 10px;
list-style-type: none;
text-align: right;
background-color: #000;
}
#navbar ul li {
display: inline;
}
#navbar ul li a {
text-decoration: none;
padding: .2em 1em;
color: #fff;
background-color: #000;
}
#navbar ul li a:hover {
color: #000;
background-color: #fff;
}
#navbar{
position: fixed;
z-index: 100000; /*To bring the navbar to the top of the stacking context*/
width: 100%;
}
nav.stricky-fixed.fadeInDown.animated{
top:40px; /*Since this element is already set as relative in the original code,
the top property places the slideIn menu 40px (height of black nav menu)
from the top of the page.*/
}
-->
</style>
</head>
<body>
<div id="navbar">
<ul>
<li style="float:left"><a class="active" href="about">facebook</a></li>
<li style="float:left"><a class="active" href="#about">twitter</a></li>
<li style="float:left"><a class="active" href="#about">linkedin</a></li>
<li><a href="mailto:project@stephensengineering.com">project@stephensengineering.com</a></li>
<li><a href="+18883000642">888-300-0642</a></li>
<li><a href="http://github.com">Stephens University</a></li>
<li><a href="http://github.com">Submit Assignment</a></li>
</ul>
</div>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire