Нужна помощь с текстом в моей навигационной панели. Элементы в нем все испорчены и смешались. Я знаю, что мой код действительно неряшлив. Я новичок в кодировании. Это ссылка на JS bin здесь http://jsbin.com/cibuvozido/edit?html,outputС моей навигационной панелью перепутано
Здесь вы можете увидеть новый код с уже набранной навигацией, но я рекомендую вам использовать фреймворк, начинающийся с бутстрапа или фундамента 6, который тоже очень хорош.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!doctype html>
<html>
<head>
\t <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" />
\t
\t <style type="text/css">
\t
.home, .security, .contact, .about, .portfolio {
display: inline-block;
text-align: center;
padding: 10px;
}
a {
text-decoration: none !important;
}
\t
\t
\t
\t .all {
\t \t margin-top:0px;
\t \t position:absolute;
\t \t margin:none;
\t \t border-style:solid;
\t \t border-color:#008000;
\t \t border-width:4px;
\t }
\t
\t #aside {
\t \t color:#0ddde7;
\t \t text-align:center;
\t \t padding-top:20px;
\t \t margin:none;
\t }
\t
\t nav {
\t \t border-bottom:solid;
\t \t border-right:solid;
\t \t border-left:solid;
\t \t border-radius:10px;
\t \t border-color:#0ddde7;
\t \t border-width:4px;
\t \t /* padding-top:20px; */
\t \t font-size:1.5em;
\t \t background-color:#0f171b;
\t \t z-index:0;
\t \t
\t }
\t
\t
\t h2 {
\t \t text-align:center;
\t \t color:#0ddde7;
\t \t padding: 0 0 0 50px;
\t \t }
\t \t
\t h3 {
\t \t text-align:center;
\t \t color:#0ddde7;
\t \t padding: 0 0 0 330px;
\t \t }
\t \t
\t .imgg {
\t \t margin-top:24px;
\t \t margin-left:40px;
\t \t border-style:solid;
\t \t border-color:#0ddde7;
\t \t border-width:2px;
\t \t border-radius:18px 18px 18px 18px;
\t \t
\t }
\t
\t .img {
\t \t padding: 14px 0 0 1220px;
\t \t pointer-events: none;
\t \t position:absolute;
\t }
\t
\t #search {
\t \t padding: 0 0 0 1105px;
\t \t height:0;
\t
\t }
.jwery {
margin-left: auto;
margin-right: auto;
display: table;
}
\t
\t .jwery a {
\t \t -webkit-transition:width 2s;
\t \t transition: 2s;
}
\t .jwery a:hover {
\t \t font-size: 1.1em;
\t }
\t
\t body {
\t \t margin:0;
\t \t padding:0;
\t \t background-color:#a4a4a4;
\t }
\t
\t
\t a:link {color:#0ddde7; text-decoration: underline; }
\t a:active {color: #0000ff; text-decoration: underline; }
\t a:visited {color: #008000; text-decoration: underline; }
\t a:hover {color: #ff0000; text-decoration: none; }
\t
\t </style>
</head>
\t
\t
<div id="Header">
<div id="search">
<form>
\t \t
\t \t <form id="img" method="get" action="http://www.google.com">
\t \t
\t \t
\t \t <input type="text" class="tftextinput" name="q" size="18" maxlength="120">
\t \t
\t \t <input type="submit" value="" style="border-style:
none; background: url('searchbutton3.gif') no-repeat; width: 13px; height: 15px;">
\t
\t \t </form>
\t \t
\t \t
\t
</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>
\t
\t <body>
\t
\t <img class="imgg" src="images/legacy.png" align=left width=300>
\t
\t <div id="aside">
\t <p>You Can Also Email Me At [email protected] Or Call/Text 252-207-
6688</p>
\t
\t <p>Feel Free To Leave Me A Message, Question, Comment, Or Recommendation.</p>
<h2>Follow Me! Please Share My Site! </h2>
\t \t
\t \t <h3>Instagram Account: LegacyWebDesign</h3>
\t \t <h3>Personl Account: Surfskateskim57</h3>
\t \t
\t \t <h3>Facebook Account: Ryan Miller</h3>
\t \t <h3>Group Name: LegacyWebDesign</h3>
\t \t
\t \t <h3>Twitter Account:LegacyWebDesign</h3>
\t \t
\t \t <h3>LinkedIn Account: LegacyWebCreations</h3>
\t </div>
\t
\t <div class="all">
\t
<a id="foxyform_embed_link_747752" href="http://www.foxyform.com/">Questions?
Comments?</a>
</div>
\t \t
<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>
\t
</body>
</html>скажите мне, если это хорошо, и только прикоснуться к CSS, которые я рекомендую вам место его на вкладке, которая говорит CSS, который лучше практика, помещенный его непосредственно в html См. Ya !! и продолжайте взломать
благодарю вас так много, и что означало, что я имею в виду, что я должен использовать фреймворк, начинающийся может быть бутстрапом или фундаментом 6, что это? – ryan
Ищите его в Интернете, у вас есть несколько фреймворков, которые могут облегчить вам жизнь с помощью css-меню, компонентов веб-дизайна и т. Д., Самый загрузочный лоток используется и имеет крутую кривую обучения, наиболее предпочтительной, но у основания 6 есть новые функции и набирает силу, (извините за мой английский). счастливая ночь. (один совет ... посмотрите на эти основные курсы). –
Пожалуйста, укажите соответствующий код непосредственно в своем вопросе, не полагайтесь на внешний сайт для его размещения (хотя полный код на внешнем сайте является хорошим * дополнением *). Кроме того, текст может быть запутан сейчас, но на что он должен выглядеть? – nnnnnn
i can not embed pics, но по какой-то причине предполагается, что он идет прямо через th etop, и он делает, но маржа перепутана каким-то образом bc там все сложено на eachother и далеко или закрыть – ryan
там предполагается быть равномерно распределенным – ryan