Автор Тема: Сайт.  (Прочетена 1618 пъти)

0 Потребители и 1 Гост преглежда(т) тази тема.

NecrosS

  • Newbie
  • *
  • Благодарности
  • -Казани: 6
  • -Получени: 0
  • Публикации: 47
Сайт.
« -: 01 Юли 2015, 13:38:30 »
Вече имам два готови сайта... (Използвам готови и безплатни templates.)Простовати и същевременно сложни и добре изглеждащи. Правя всичко само за практика, нищо няма да правя с тези сайтове. Сега правя трети, обаче срещам проблем, с който до сега не съм се срещал... Изглежда глупав, но досега не ми се е налагало:



Следния текст как мога да го сложа върху navigation изображението и същевременно да раздалечя връзките едно от друго...
Сетих се да използвам "word-spacing:" обаче то раздалечава думите, а не самите ''a'' тагове.

<!DOCTYPE html>
<html>
<head>
<title>Fantasy game</title>
<link href="style.css" type="text/css" rel="stylesheet">
</head>
<body>

<div id="header_nav">
<img src="logo.png" class="logo" >
<img src="bg-navigation.png" class="nav">
<div class="buttons">
<a href="#" style="color:white" >HOUSE OF DANAK</a>
<a href="#" style="color:white" >DRAAGAN LORE</a>
<a href="#" style="color:white" >MYTHS OF D'ROGA</a>
<a href="#" style="color:white" >ARCHIVES</a>
</div>
</div>

</body>
</html>

#header_nav {
background-image:url('bg-header.jpg');
height:330px;
width:1190px;
margin:auto;
}

.logo {
display:block;
margin:auto;
margin-top:auto;
}

.nav {
display:block;
margin:auto;
}

.buttons{
margin-left:200px;
width:500px;
color:white;
display:inline;
}

« Последна редакция: 01 Юли 2015, 19:26:30 от Avalanche »

Avalanche

  • Administrator
  • Hero Member
  • *****
  • Благодарности
  • -Казани: 65
  • -Получени: 275
  • Публикации: 2602
  • meow
Re: Сайт.
« Отговор #1 -: 01 Юли 2015, 19:34:58 »
Здрасти,

линковете не са обикновен текст за може ги преместиш с word-spacing. Вместо това е трябва да използваш селектор за линковете и да им дадеш някакво остояние по друг начин, примерно с margin http://jsfiddle.net/tt29jk1d/:

Код: HTML
  1. .buttons a {
  2.     margin: 0 100px 0 0;
  3. }

По принцип менютата се слагат в листове (<ul> и <li> тагове, а вече с HTML5 се ползва специално и nav таг за навигация.
"Компютрите не правят каквото искаме, а каквото им кажем." Ако разбереш какво значи това няма да имаш големи проблеми, нито с никоя ОС, нито език, или софтуер.
Аз не съм програмист между другото!

NecrosS

  • Newbie
  • *
  • Благодарности
  • -Казани: 6
  • -Получени: 0
  • Публикации: 47
Re: Сайт.
« Отговор #2 -: 02 Юли 2015, 09:33:28 »
Здрасти,

линковете не са обикновен текст за може ги преместиш с word-spacing. Вместо това е трябва да използваш селектор за линковете и да им дадеш някакво остояние по друг начин, примерно с margin http://jsfiddle.net/tt29jk1d/:

Код: HTML
  1. .buttons a {
  2.     margin: 0 100px 0 0;
  3. }

По принцип менютата се слагат в листове (<ul> и <li> тагове, а вече с HTML5 се ползва специално и nav таг за навигация.

Не знам какво ми стана вчера, от умора или какво, обаче сега гледам и се чудя как мога да изпусна такива прости неща...  ;D Станах и си го направих набързо, обаче все още остава проблема с раздалечаването... ТОВА е нещото, с което досега не съм се сблъсквал...

Avalanche

  • Administrator
  • Hero Member
  • *****
  • Благодарности
  • -Казани: 65
  • -Получени: 275
  • Публикации: 2602
  • meow
Re: Сайт.
« Отговор #3 -: 02 Юли 2015, 19:26:12 »
Видя ли примера в JSFiddle?
"Компютрите не правят каквото искаме, а каквото им кажем." Ако разбереш какво значи това няма да имаш големи проблеми, нито с никоя ОС, нито език, или софтуер.
Аз не съм програмист между другото!

NecrosS

  • Newbie
  • *
  • Благодарности
  • -Казани: 6
  • -Получени: 0
  • Публикации: 47
Re: Сайт.
« Отговор #4 -: 02 Юли 2015, 23:37:38 »
Видя ли примера в JSFiddle?

Чак сега.. За какво са другите числа, нулите?

Avalanche

  • Administrator
  • Hero Member
  • *****
  • Благодарности
  • -Казани: 65
  • -Получени: 275
  • Публикации: 2602
  • meow
Re: Сайт.
« Отговор #5 -: 03 Юли 2015, 22:31:38 »
"Сбито" (shorthand) писане на:
Код: CSS
  1. margin-top: 0;
  2. margin-right: 100px;
  3. margin-bottom: 0;
  4. margin-left: 0;

Ползват се и за други свойства, правилото за подредбата им е според часовниковата стрелка, като почва от 12 часа. Това е техника за позициониране, доста често се ползва за центриране margin: 0 auto. Което ще сложи 0 отгоре и отдолу и auto от дясно и ляво.
"Компютрите не правят каквото искаме, а каквото им кажем." Ако разбереш какво значи това няма да имаш големи проблеми, нито с никоя ОС, нито език, или софтуер.
Аз не съм програмист между другото!

HD

  • Administrator
  • Hero Member
  • *****
  • Благодарности
  • -Казани: 208
  • -Получени: 165
  • Публикации: 3077
Re: Сайт.
« Отговор #6 -: 05 Юли 2015, 11:59:59 »
Понеже виждам, че ти харесва да се занимаваш, може да направиш сайта да е responsive. Има някой интересни тактики, които може да научиш.

nikoleta

  • Newbie
  • *
  • Благодарности
  • -Казани: 1
  • -Получени: 1
  • Публикации: 5
    • Нови-филми.com
Re: Сайт.
« Отговор #7 -: 11 Март 2016, 15:43:04 »
Защо не споделиш и другите сайтове? До сега може да се е получило нещо интересно или ти самият да си променял нещо?
Винаги нови филми - Novi filmi