ottawa1
Newbie-
Posts
5 -
Joined
-
Last visited
ottawa1's Achievements
Explorer (1/14)
0
Reputation
-
Здравствуйте.Подскажите где найти java-скрипт "Кто на сайте". Сегодня пересмотрел много каталогов ничего не нашел.
-
Приветствую.Справился самостоятельно.Как говорил Остап Бендер:"Спасение утопающих дело рук самих утопающих".Выкладываю код,надеюсь кому нибудь пригодится. <style type="text/css"> .bord { position:relative; margin: 10px auto; background: #FFFFFF; width:90%; height:90%; border:2px solid #B0B384; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; } .content { position:absolute; top:10px; left: 290px; right:10px; background: #EBECDF; height:96%; border:2px solid #B0B384; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; font-weight:600; font-size:18px; line-height:35px; padding-left: 10px; } .mord { position:relative; top:-35px; left: -290px; background: #8E925A; width:258px; height:35px; border:2px solid #B0B384; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; font-weight:600; font-size:18px; line-height:35px; padding-left: 10px; } .maxc { position:relative; top:10px; left:-10px; background: #E5E6D6; width:265px; height:222px; border:2px solid #B0B384; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; text-align:left; } .menu { font-family:arial,sans-serif; width:260px; height:150px; position:relative; margin:0; font-size:11px; left:10px; } .menu ul li a, .menu ul li a:visited { display:block; text-decoration:none; color:#705e24; width:254px; height:43px; border:1px solid #c4c7a3 ; border-width:1px 1px 0 0; background:#e5e6d6; line-height:43px; font-size:16px; font-weight:600; } .menu ul { padding:0; margin:0; list-style-type: none; } .menu ul li { float:left; margin-right:1px; position:relative; } .menu ul li ul { display: none; } .menu ul li:hover a { color:#fff; background:#b3ab79; } .menu ul li:hover ul { display:block; position:absolute; top:0; left:255px; width:105px; } .menu ul li:hover ul li a.hide { background:#dfc184; color:#000; } .menu ul li:hover ul li:hover a.hide { width:250px; } .menu ul li:hover ul li ul { display: none; } .menu ul li:hover ul li a { display:block; background:#b3ab79; color:#000; width:150px; } .menu ul li:hover ul li a:hover { background:#dfc184; color:#000; } .menu ul li:hover ul li:hover ul { display:block; position:absolute; left:151px; top:0; color:#000; } .menu ul li:hover ul li:hover ul li a { display:block; width:200px; background:#dfc184; color:#000; } .menu ul li:hover ul li:hover ul li a:hover {background:#bd8d5e; color:#fff; } </style> <div class="bord"> <div class="content"> контент <div class="mord"> <img src='http://mysite.ru/images/075.gif'> Начинай отсюда <div class="maxc"> <div class="menu"> <ul> <li><a class="hide" href="#">Главная</a> </li> <li><a class="hide" href="#">Максим</a> <ul> <li><a href="#" title="Описание">№ 4 2012 год</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> </ul> </li> <li><a class="hide" href="#">Екатерина</a> <ul> <li><a href="#" title="Описание">№ 2 2012 год</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> </ul> </li> <li><a class="hide" href="#">Некрасов</a> <ul> <li><a href="#" title="Описание">№ 23 2001 год</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> </ul> </li> <li><a class="hide" href="#">Контакты</a> </li> </ul> </div> </div> </div> </div>
-
Приветствую.Для IE- создам отдельную страничку,если кто зайдет с IE - получит страницу где в <table> увидит квадраты.Пока что я поместил два блока слева это заголовок меню и меню.Теперь если у кого есть желание и время подскажите как справа разместить резиновый блок в который я помещу контент.Приведу код и рисунок что у меня получилось <style type="text/css"> .bord { margin: 10px auto; background: #FFFFFF; width:90%; height:90%; border:2px solid #B0B384; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; } .mord { position:relative; /* относительное */ top:8px; left: 10px; /* Положение от правого края */ background: #8E925A; width:258px; height:35px; border:2px solid #B0B384; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; font-weight:600; font-size:18px; line-height:35px; padding-left: 10px; } .maxc { position:relative; /* относительное */ top:10px; left:-10px; /* Положение от правого края */ background: #E5E6D6; width:265px; height:222px; border:2px solid #B0B384; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; text-align:left; } .menu { font-family:arial,sans-serif; width:260px; height:150px; position:relative; margin:0; font-size:11px; left:10px; } .menu ul li a, .menu ul li a:visited { display:block; text-decoration:none; color:#705e24; width:254px; height:43px; border:1px solid #c4c7a3 ; border-width:1px 1px 0 0; background:#e5e6d6; line-height:43px; font-size:16px; font-weight:600; } .menu ul { padding:0; margin:0; list-style-type: none; } .menu ul li { float:left; margin-right:1px; position:relative; } .menu ul li ul { display: none; } .menu ul li:hover a { color:#fff; background:#b3ab79; } .menu ul li:hover ul { display:block; position:absolute; top:0; left:255px; width:105px; } .menu ul li:hover ul li a.hide { background:#dfc184; color:#000; } .menu ul li:hover ul li:hover a.hide { width:250px; } .menu ul li:hover ul li ul { display: none; } .menu ul li:hover ul li a { display:block; background:#b3ab79; color:#000; width:150px; } .menu ul li:hover ul li a:hover { background:#dfc184; color:#000; } .menu ul li:hover ul li:hover ul { display:block; position:absolute; left:151px; top:0; color:#000; } .menu ul li:hover ul li:hover ul li a { display:block; width:200px; background:#dfc184; color:#000; } .menu ul li:hover ul li:hover ul li a:hover {background:#bd8d5e; color:#fff; } </style> <div class="bord"> <div class="mord"> <img src="075.gif"> Начинай отсюда <div class="maxc"> <div class="menu"> <ul> <li><a class="hide" href="#">Главная</a> </li> <li><a class="hide" href="#">Максим</a> <ul> <li><a href="#" title="Описание">№ 4 2012 год</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> </ul> </li> <li><a class="hide" href="#">Поздравления</a> <ul> <li><a href="#" title="Описание">№ 2 2012 год</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> </ul> </li> <li><a class="hide" href="#">Мир приключений</a> <ul> <li><a href="#" title="Описание">№ 23 2001 год</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> <li><a href="#" title="Описание">Пункт меню</a></li> </ul> </li> <li><a class="hide" href="#">Контакты</a> </li> </ul> <div class="content"> </div> </div> </div> </div> </div> Рисунок
-
Получилось. <style type="text/css"> .bord { margin: 0 auto; background: #EBECDF; width:90%; height:90%; border:2px solid #B0B384; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; } .mord { position:relative; /* относительное */ top:8px; left: 10px; /* Положение от правого края */ background: #EBECDF; width:240px; height:30px; border:2px solid #B0B384; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; } .maxc { position:relative; /* относительное */ top:18px; left:-3px; /* Положение от правого края */ background: #EBECDF; width:240px; height:200px; border:2px solid #B0B384; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; } </style> <div class="bord"> <div class="mord"> второй <div class="maxc"> третий </div> </div> </div> во всех браузерах нормально.Только в IE7 нет то что вместо закругленных прямоугольники это понятно.Но есть еще искажения.Может какой хак есть для IE7
-
Здравствуйте.Подскажите.Создал объекты с закругленными углами.Один с фиксированной высотой и шириной внутри другого у которого ширина и высота 90%.Как этот внутренний объект двигать? И как внутрь еще добавить объекты.В конечном итоге это будет страница сайта большой объект у которого 90% ширина и высота и несколько маленьких меню и содержание в которых будут размещаться.Код <style type="text/css"> div { margin: 0 auto; } .bord { background: #EBECDF; width:90%; height:90%; border:2px solid #B0B384; border-radius:30px; -webkit-border-radius:30px; -moz-border-radius:30px; } .mord { background: #EBECDF; width:600px; height:400px; border:2px solid #B0B384; border-radius:30px; -webkit-border-radius:30px; -moz-border-radius:30px; } </style> <div class="bord"> <div class="mord"> </div> </div> изображение