ar.
Newbie-
Posts
8 -
Joined
-
Last visited
ar.'s Achievements
Explorer (1/14)
0
Reputation
-
Спасибо помогло! ))
-
Как поместить кнопку в окно ввода и выровнять по правую строну окна? форма
-
Всё верно, спасибо большое.
-
К сожалению не помогло.
-
Не могу убрать верхний отступ у фоновой картинки в хэдере с помощью margin. Не могу въехать почему При установке position: absolute; верхний отступ убирается, но тогда не выравнивается по центру по горизонтали. Буду очень благодарен за ответы! Прошу не сильно ругаться Ниже код: - body { background-color: #f8ebb8; margin: 0 auto; width: 100%; } [b]div#header-all { background: url('../img/header-all.jpg') no-repeat; background-color: #f8ebb8; margin: 0 auto; position: relative; height: 406px; width: 1200px; } <body> <div id="header-all"><!--Хэдер--> <div id="header-1"> <!--Верхние кнопки+Поисковая форма--> <p id="action-button"> <!--Верхние кнопки--> <a href="#help" title="Live help">Live hel</a> <a href="#login" title="Login/Register">Login/Register</a> </p> <form action="#search" method="post" id="search-form"> <!--Поисковая форма--> <p> <input type="text" name="query" value="Search" /> <input type="submit" name="submit" value="Search!" /> </p> </form> <!--Поисковая форма--> </div><!--Верхние кнопки+Поисковая форма--> <div id="logo" > <!--Логотип(картинка+надпись)--> <h1><a href="#home" title="Home Page">herbal treats</a></h1> </div><!--Логотип(картинка+надпись)--> </div><!--Хэдер-->
-
я собственно крайне редко бездумно что либо делаю )) и моя думность в данном случае заключалась в том, что я думал что something.png подразумевает любую картинку с расширением .png ) "не сможет переопределить заданный через идентификатор стиль." у меня естественный вопрос почему? - только не посылайте меня к талмудам,я и так их стараюсь читать. Это работает .active {background-repeat: no-repeat !important;} Только вопрос - что делалет значение!important? А это #tabname_1.active {background: url('something.png') no-repeat;} получается всё равно дубляж, раз делать его нужно для каждого элемента. Ну собственно вопрос про часть имени id я так и не услышал. А вообще спасибо вам за помощь! пока всё работает
-
Не сработал не один из вариантов, кроме тех что у меня были. А что на счёт вопрос об имени id селектора? Ниже весь код html - <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>New Beautyfull Tabs from Belyash</title> <link rel="stylesheet" type="text/css" href="style.css" /> <meta http-equiv="Content-type" content="text/html;charset=UTF-8" /> <script type="text/javascript" src="jquery-1.4.2.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".selectTabs").each(function () { var tmp = $(this); console.log($(tmp).find(" .lineTabs li")); $(tmp).find(".lineTabs li").each(function (i) { $(tmp).find(".lineTabs li:eq("+i+") a").click(function(){ var tab_id=i+1; $(tmp).find(".lineTabs li a").removeClass("active"); $(this).addClass("active"); $(tmp).find(".content div").stop(false,false).hide(); $(tmp).find(".tab"+tab_id).stop(false,false).show(); return false; }) }) }) }) </script> </head> <body> <div id="wrap"> <div class="selectTabs"> <ul class="lineTabs"> <li><a id='tabname_6' href="#" class="active">HOMEPAGE</a></li> <li><a id='tabname_5' href="#">HERBS</a></li> <li><a id='tabname_4' href="#">TEAS</a></li> <li><a id='tabname_3' href="#">SPICE</a></li> <li><a id='tabname_2' href="#">AROMATHERAPY</a></li> <li><a id='tabname_1' href="#">SHOPPING GUIDE</a></li> </ul> <div class="content"> <div class="tab1"> <h3>Напишите мне</h3> <form action="#"> <label for="name">Ваше имя</label><br /> <input name="name" type="text" /><br /> <label for="email">Ваш E-mail</label><br /> <input name="email" type="text" /><br /> <label for="comment"">Текст сообщения</label><br /> <textarea name="comment"></textarea> </form> </div> <div class="tab2"> <h3>Contrary to popular</h3> <p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old.</p> <h3>Richard McClintock</h3> <p>Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source.</p> <h3>Lorem Ipsum</h3> <p>Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of "de Finibus Bonorum et Malorum" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet..", comes from a line in section 1.10.32.</p> </div> <div class="tab3"> <img src="images/giraf.jpg" /> </div> <div class="tab4" style="display:block;"> <img src="images/zayac.jpg" style="float: left; padding-right: 15px;" /> <p>Зайцы (лат. Leporidae) — семейство млекопитающих из отряда зайцеобразных, включающее в себя собственно зайцев (главным образом род Lepus, но также Pronolagus и Caprolagus) и кроликов (остальные роды). Зайцы распространены по всему миру, кроме Австралии и отдаленных островов, на многие из которых ввезены людьми. Отличаются от пищух развитыми задними конечностями, длинными ушами и наличием короткого хвоста.</p> </div> </div> </div> </div> <div style="position: absolute; bottom: 5px; left: 5px;"> <a style="color: rgb(27, 100, 220); font: 12px arial;" href="http://web4develop.ru">web4develop.ru</a> </div> </body> </html> css- html, body{ background:#aaa url(images/bg.png); color:#00557F; font:normal 14px Verdana; margin:0px; padding:0px; } h3{ border-bottom:1px solid #4c9ac3; } form, label, input, textarea{ font-size:11px; } input{ background:#BBD9FA; border:1px solid #4c9ac3; height:12px; margin:0px 0px 5px 0px; width:150px; } textarea{ background:#BBD9FA; border:1px solid #4c9ac3; height:36px; width:460px; } #wrap{ margin:30px auto; width:1000px; } .lineTabs{ height:30px; list-style:none; margin:0px auto; padding:0px; padding-right:30px; padding-left:10px; width:auto; } .lineTabs li{ display:block; float:right; margin:0px; padding:0px; position:relative; overflow:visible; text-align:center; width:110px; } .lineTabs li a{ background-repeat: no-repeat; color:#600; display:block; font:normal 14px Verdana; height:46px; margin:0px -10px; outline:none; padding:7px 20px; position:relative; text-decoration:none; width:90px; } .lineTabs li a.active{ background-repeat: no-repeat; color: #600; font-weight: bold; } .lineTabs li a:hover{ color: #600; font-weight: bold; } .active {background-repeat: no-repeat;} #element {background: url('something.png') no-repeat;} #tabname_1.active{ background:url(images/ShoppingGuide.png); } #tabname_2.active{ background:url(images/Aromatherapy.png); } #tabname_3.active{ background:url(images/Spise.png); } #tabname_4.active{ background:url(images/Teas.png); } #tabname_5.active{ background:url(images/Herbs.png); } #tabname_6.active{ background:url(images/Homepage.png); } .content{ background:white; border:1px solid #4c9ac3; display:block; float:left; clear:left; height:auto; margin:0px; padding:10px; position:relative; text-align:justify; width:460px; } .content div{ background:white; display:none; height:auto; float:left; clear:both; left:0px; margin:0px; padding:0px; position:static; top:0px; width:100%; } .content div p{ margin:5px 0px; padding:0px; } .selectTabs{ float:left; margin:5px; }
-
Добрый день. Подскажите как правильно прописать свойство background-repeat, а то у меня кроме как указанным ниже способом не получается (много дубляжа при этом)? И ещё, подскажите можно ли (и как) использовать не полностью имя селектора id, а только его часть, например вместо tabname_3, просто tabname... и чтоб стиль применялся ко всем селекторам id начинающихся с этого имени? Извините, но не мог найти ответа возможно на не сложную задачу. С уважением Артём. html- ================ <div id="wrap"> <div class="selectTabs"> <ul class="lineTabs"> <li><a id='tabname_6' href="#">SHOPPING GUIDE</a></li> <li><a id='tabname_5' href="#">AROMATHERAPY</a></li> <li><a id='tabname_4' href="#">SPICE</a></li> <li><a id='tabname_3' href="#">TEAS</a></li> <li><a id='tabname_2' href="#">HERBS</a></li> <li><a id='tabname_1' href="#" class="active">HOMEPAGE</a></li> ================ css- ================ #tabname_1.active{ background:url(images/Homepage.png); background-repeat: no-repeat; } #tabname_2.active{ background:url(images/Herbs.png); background-repeat: no-repeat; } #tabname_3.active{ background:url(images/Teas.png); } ================