我的导航栏被搞砸了

时间:2016-03-12 05:30:34

标签: javascript

需要有关导航栏上文字的帮助。它中的项目都搞砸了,混乱我知道我的代码真的很草率我不熟悉编码。这是与JS bin http://jsbin.com/cibuvozido/edit?html,output

的链接

1 个答案:

答案 0 :(得分:0)

在这里你可以看到已经修改了navbar的新代码,但是我建议你使用一个框架,可以是bootstrap或foundation 6,这也非常好。



<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!doctype html>
<html>
<head>
	 <title> Contact Us Legacy's Web-Design</title>

 <meta charset="utf-8" />
 <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
 <meta name="viewport" content="width=device-width, initial-scale=1" />

	
	<style type="text/css">
	
      .home, .security, .contact, .about, .portfolio {
        display: inline-block;
        text-align: center;
        padding: 10px;
      }
      a {
        text-decoration: none !important;
      }
	
	
	
	.all {
		margin-top:0px;
		position:absolute;
		margin:none;
		border-style:solid;
		border-color:#008000;
		border-width:4px;
	}
	
	#aside {
		color:#0ddde7;
		text-align:center;
		padding-top:20px;
		margin:none;
	}
	
	nav {
		border-bottom:solid;
		border-right:solid;
		border-left:solid;
		border-radius:10px;
		border-color:#0ddde7;
		border-width:4px;
		/* padding-top:20px; */  
		font-size:1.5em;
		background-color:#0f171b;
		z-index:0;
		
	}
	
	
	h2 {
		text-align:center;
		color:#0ddde7;
		padding: 0 0 0 50px;
		}
		
	h3 {
		text-align:center;
		color:#0ddde7;
		padding: 0 0 0 330px;
		}
		
	.imgg {
		margin-top:24px;
		margin-left:40px;
		border-style:solid;
		border-color:#0ddde7;
		border-width:2px;
		border-radius:18px 18px 18px 18px;
		
	}
	
	.img {
		padding: 14px 0 0 1220px;
		pointer-events: none;
		position:absolute;
	}
	
	#search {
		padding: 0 0 0 1105px;
		height:0;
	
	}
      .jwery {
        margin-left: auto;
        margin-right: auto;
        display: table;
      }
	
	.jwery a   {
		-webkit-transition:width 2s; 
		transition: 2s;
}
	.jwery a:hover {
		font-size: 1.1em;
	}
	
	body {
		margin:0;
		padding:0;
		background-color:#a4a4a4;

	}
	
	
	a:link {color:#0ddde7; text-decoration: underline; }
	a:active {color: #0000ff; text-decoration: underline; }
	a:visited {color: #008000; text-decoration: underline; }
	a:hover {color: #ff0000; text-decoration: none; }
	
	</style>

</head>


	
	
       
        <div id="Header">
            
            <div id="search">
            
            
            <form>
		
		<form id="img" method="get" action="http://www.google.com">
		
		    
		       <input type="text" class="tftextinput" name="q" size="18" maxlength="120">
		     
		     <input type="submit" value="" style="border-style: 
none; background: url('searchbutton3.gif') no-repeat; width: 13px; height: 15px;">
	
		</form>
		
		
	
</div>

<img class="img" src="images/search.png" height="19.4">
    
      
      <nav>
      
      <div class="jwery">
            
        <a class="home" href="Home.html">Home</a>
        <a class="security" href="Security.html">Security</a>
        <a class="FAQ" href="Portfolio.html">Portfolio</a>
        <a class="about" href="About.html">About Us</a>
        <a class="contact" href="Contact Us.html">Contact Us</a>
        
        
    </div>
    
    </nav>
	
	<body>
	
	<img class="imgg" src="images/legacy.png" align=left width=300>
	
	<div id="aside">

	<p>You Can Also Email Me At LegacyWebCreations@gmail.com Or Call/Text 252-207-
6688</p>
	
	<p>Feel Free To Leave Me A Message, Question, Comment, Or Recommendation.</p>

<h2>Follow Me! Please Share My Site! </h2>
		
		<h3>Instagram Account: LegacyWebDesign</h3>
		<h3>Personl Account: Surfskateskim57</h3>
		
		<h3>Facebook Account: Ryan Miller</h3>
		<h3>Group Name: LegacyWebDesign</h3>
		
		<h3>Twitter Account:LegacyWebDesign</h3>
		
		<h3>LinkedIn Account: LegacyWebCreations</h3>



	</div>
	
	<div class="all">
	
<a id="foxyform_embed_link_747752" href="http://www.foxyform.com/">Questions?
 Comments?</a>

</div>

		
<script>

(function(d, t){

   var g = d.createElement(t),
       s = d.getElementsByTagName(t)[0];

   g.src = "http://www.foxyform.com/js.php?id=747752&sec_hash=fd11cc5da35&width=380px";

   s.parentNode.insertBefore(g, s);

}(document, "script"));

</script>


	


 </body>
 
</html>
&#13;
&#13;
&#13;

  

告诉我这是否好,只触及我推荐你的CSS   将它放在显示css的选项卡中,这是最佳实践   它直接在html 看到Ya !!并继续黑客攻击