IvanRu08
-
Posts
224 -
Joined
-
Last visited
-
Days Won
3
Content Type
Profiles
Forums
Calendar
Store
Everything posted by IvanRu08
-
http://feedburner.google.com
-
Спасибо, буду пробовать.
-
Всем привет. Вот мучает вопрос, как сделать такую тень на css: http://clip2net.com/s/5rR9d5 Я с тенями пока на "ВЫ". Может лучше сделать картинкой?
-
Ну вот, с помощью before и after добавляется эти самые треугольники. Вот почитайте: http://dimox.name/beautiful-tags-markup/
-
Ну, можно сделать заведомо длинное изображение. Затем тексту сделать inline-block. Добавить отступов и с помощью псевдоэлементов :before и :after сделать стрелочки.
-
Уже можно забыть про ие7. Нужно про ие8. А с ие9-10 проблем, лично у меня, уже не возникает
-
Фух, спасибо разобрался. Написал: *:first-child+html .nav.menu ul li { zoom:1; display: inline; } вместо: *:first-child+html (без точки)nav.menu ul li { zoom:1; display: inline; }. Но вопрос про непонимание некоторых стилей ие7 остался.
-
про http://jsfiddle.net/ знаю, но как туда картинки прикреплять? По горизонтали значит в один ряд. За ссылку спасибо, почитаю PS, Почитал в статье используется zoom:1; display: inline; для ie7. У меня этот прием не работает.
-
Всем привет. Уже несколько часов пытаюсь выровнять меню по горизонтали в ие7. Для решения проблемы использовал css хак для ие7: *:first-child+html .nav.menu ul li { zoom:1; display: block; position: relative; } В ие7 изменений не произошло, зато в ие8 все стало на свои места . Вот полный код, к сожалению разместить на хостинге пока не могу: /**General**/ * { margin: 0; padding: 0; } img { border: 0; } body { font-family: Arial; background: #f1f1f1; min-width: 960px; } header,nav,section,footer,aside { display: block; height: 1%; } *:first-child+html .nav.menu ul li { zoom:1; display: block; position: relative; } /**Main**/ #wrapper { width: 1118px; height: 1343px; margin: auto; } /**Header**/ header { height: 330px; } .header-bg { height: 330px; background: url(images/header-bg.jpg) no-repeat; } /**Logo**/ .logo img { position: relative; margin-left: 89px; margin-top: 26px; } /**Menu**/ nav.menu { font-family: Arial; margin-left: 400px; margin-top: -48px; } nav.menu ul li { display: inline-block; list-style-type: none; margin-right: -11px; padding: 9px 9px 8px; } nav.menu ul li a{ font-weight: bold; font-size: 12px; color: #f1f1f1; text-decoration: none; text-transform: uppercase; padding: 9px 9px 8px; } nav.menu ul li a:hover { box-shadow: inset 1px 1px 1px 1px rgba(0,0,0,0.75); border-bottom: 1px solid #313a44; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; background: #14191f; } nav.menu ul li.current a { box-shadow: inset 1px 1px 1px 1px rgba(0,0,0,0.75); border-bottom: 1px solid #313a44; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; background: #14191f; } /**SocialButton**/ .h-social img.rss { background: url(images/rss-sprite.png) no-repeat; } .h-social img.rss:hover { background-position: 0 -26px; } .h-social img.twitter { background: url(images/tw-sprite.png) no-repeat; } .h-social img.twitter:hover { background-position: 0 -26px; } .h-social img.plus { background: url(images/plus-sprite.png) no-repeat; } .h-social img.plus:hover { background-position: 0 -26px; } .h-social img.facebook{ background: url(images/face-sprite.png) no-repeat; } .h-social img.facebook:hover { background-position: 0 -26px; } .h-social ul{ list-style-type: none; } .h-social ul li { margin-bottom: 20px; margin-left: 1062px; } <!DOCTYPE html> <html lang = "ru"> <head> <title>Блог курского бомжа</title> <link href = "style.css" rel = "stylesheet" type = "text/css"/> <meta charset = "utf-8"/> <!--[if lt IE 9]> <script src = "http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> </head> <body> <div id = "wrapper"> <header> <div class = "header-bg"> <div class = "logo"> <a href = "#"><img src = "images/logo.png" alt = "Блог Курского Бомжа"></a> </div> <nav class = "menu"> <ul> <li class = "current"><a href="#">Главная</a></li> <li><a href="#">Карта блога</a></li> <li><a href="#">Мои цели</a></li> <li><a href="#">Мои услуги</a></li> <li><a href="#">Об авторе</a></li> </ul> </nav> <div class = "h-social"> <ul> <li><a href="#"><img class = "rss" src = "images/soc-b.png" alt = "RSS"></a></li> <li><a href="#"><img class = "twitter" src = "images/soc-b.png" alt = "TWITTER"></a></li> <li><a href="#"><img class = "plus" src = "images/soc-b.png"></a></li> <li><a href="#"><img class = "facebook" src = "images/soc-b.png" alt = "facebook"></a></li> </div> </div> </header> <div id = "main"> <div class = "content"></div> <aside class = "right"></aside> </div> </div> <footer></footer> </body> </html> +мне кажется, что ие7 просто не понимает некоторых стилей. Так в пункте меню нет нижней серой рамки, например.
-
Спасибо огромное!
-
Ооо, жаль. А как можно добиться сглаживание с помощью теней?
-
Всем привет. Вот верстаю макет блога. В макете используется шрифт(сглаживание sharp). Вопрос: как повторить это сглаживание в браузере? А то текст по другому смотриться... Заранее спасибо!
-
как сделать простейший поисковик по интернету при табличной верстке
IvanRu08 replied to kotsa3's question in HTML Coding
А зачем ЭТО делать таблицами? Вот простейший код: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Поиск</title> </head> <body> <form action="search.php"> <input type = "search" name = "field" size = "30" value = "Введите запрос" title = "Поле для поиска"> <input type = "submit" name = "button" value = "Поиск" title = "Искать"> </form> </body> </html> -
Ребят, почему у меня меню не выравнивается по горизонтали в ие7-8? Блин, достали уже эти браузеры! Вот код: <body> <div class = "conteiner"> <header> <div class = "top-border"></div> <div class = "header-bg"> <div class = "logo"> <a href = "#"><img src = "images/logo.png" altv = "logo"></a> </div> <nav class = "menu"> <ul> <li class = "active"><a href = "#">Home</li></a> <li><a href = "#">Full Width</li></a> <li><a href = "#">Arhives</li></a> <li><a href = "#">Portfolio</li></a> <li><a href = "#">Blog</li></a> <li><a href = "#">Contact</li></a> </ul> </nav> </div> </header> </div> </body> body {width: 1150px; height: 3000px; background: url(images/body-bg.jpg) no-repeat; margin: auto;} @font-face {font-family: ProximaNova-Semibold; src: url(fonts/ProximaNova-Semibold.otf)} /**Шапка**/ header .top-border {height: 15px; background: url(images/border-top.jpg) no-repeat center;} .header-bg {height: 169px; width: 100%; background:url(images/header-bg.jpg) no-repeat center;} .logo img {left: 93px; position: relative; top: 33px;} nav.menu ul {text-transform: uppercase; font-size: 12px; list-style-type: none; margin-left: 448px; margin-top: -1px;} nav.menu ul li { display: inline; font-family: ProximaNova;} nav.menu ul li a {text-decoration: none; color: #fff; text-shadow: 1px 1px rgba(0,0,0,0.5); padding: 6px 21px; font-size: 12px;} nav.menu ul li.active a {background: #1e1d1c; padding: 6px 21px; border-radius: 4px; -moz-border-radius:4px; -webkit-border-radius: 4px; box-shadow: 1px 1px rgba(255, 255, 255, 0.07)} Плиз, помогите, срочно!
-
стараюсь все выправить.IvanRu08, держи: http://www.freepsd.w...a-gooddate.html Спасибо огромнейшее!
-
Вот почитай про текст,в низу http://habrahabr.ru/post/154211/ , http://worldwebinfo....-тень-в-тексте/ я думаю не обязательно на 100% делать дословно,можно на 90% но при это : 1. Ты всегда сможешь изменить текст,а не картинкой всё делать. 2. Уменьшится вес сайта,картинка больше весит,чем текст. Если не ошибаюсь,то любой шрифт можно подключить,а так найди похожий шрифт,но более известный и читабельный и подключай . Спасибо огромное за ссылки. Раньше не знал про свойство text-shadow. Остается нерешенным вопрос с версткой в ie7
-
Поделись макетом, плиз
-
ток еще забыли упомянуть что при вордпрес весь в дырах и закрывать придется многие дыры самому О Каких Дырах идет речь? У все кмс есть дыры, так или иначе. Да, я согласен, в вп есть файлы, которые могут помочь ломануть сайт, но если эти файлы удалить или скрыть, то взломать сайт будет сложно.
-
Аааа, блин. Почему когда на локалке тестил код он был валидным, а щас 24(!) ошибки! В чем может быть дело?
-
1. Да, спасибо за подсказку, уберу. 2. Привык закрывать все html теги. 6. Исправлю. 7. Как можно заметить заголовок смотрится, как немного вдавленный с снизу у букв есть белый цвет + шрифт Myriad Pro c каким-то начертанием Bold Condenced. Такой шрифт можно воспроизвести посредством Css? Если можно, то был бы очень рад. 8. О каких скриптах идет речь? 9. Нет, так как фон у меня фикс.размеры. Причем не подлежит повторению по y, т.к не стыкуется нормально. А если я прижму подвал к низу, то он уедет на границу фона. 10. Спасибо, почитаю. 12. Вот я и просил подсказать почему верстка разъезжается в ie7. Спасибо огромное за оценку! Согласен =) А так же можно сделать в лого текст и were creative...,и лого можно мне кажется в css спрятать,да и смысл уже в картинке если есть див с классом ? И можно сделать клибальным . И да,не знаю в чём дело,но у меня появляется скролинг справа (по вертикале),хотя не чего не скролит.. разрешение 1600x900 См. сообщение выше п.7. Странно у меня скрола нет.
-
http://ivanru08.hut2.ru/
-
нет, бесплатные хостинги я знаю, щас залью. Спасибо за подсказку.
-
количество пикселей неизвестно. Не буду уверен, но скажу, что такой макет в принципе невозможно реализовать. Хотя бы потому, что 100% - это вся ширина экрана...
-
Выбор CMS напрямую зависит от типа сайта, который хотите создать. Я советую WordPress, как самую универсальную cms. На ней при желании можно реализовать практический любой проект, начинаю от простого блога и заканчивая интернет-магазином или информационным порталом.
-
Всем привет. Наконец-то сверстал первый свой макет. Прошу оценить, подсказать, как нужно делать, а как делать не стоит. В общем, прошу дать дельных советов новичку. Верстка проходит валидность, но с 2 предупреждениями. Как их убрать? <!DOCTYPE html> <html lang = "ru"> <head> <title>Портфолио</title> <link href = "style.css" rel = "stylesheet" type = "text/css" /> <meta charset = "utf-8" /> <!--[if lt IE 9]> <script src = "http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> </head> <body> <header> <div class = "header_bg"> <div class = "logo"> <img src="images/logo.png" alt = "Design Studio"> </div> <nav class = "menu"> <ul> <li class = "current"><a href = "#">HOME</a></li> <li><a href = "#">ABOUT</a></li> <li><a href = "#">WORK</a></li> <li><a href = "#">BLOG</a></li> <li><a href = "#">CONTACT</a></li> </ul> </nav> </div> </header> <section class = "content"> <div class = "content_bg"> <h1><img src = "images/h1.png" alt = "Name"></h1> <div class = "con"> <img src = "images/images.png" alt = "img"> <span>Portfolio project, Jan 5th, 2010</span> <p>Have you ever wanted to create clean and nice portfolio design? In this tutorial I will show you how to design clean blue portfolio layout. Have you ever wanted to create clean and nice portfolio design? In this tutorial I will show you how to design clean blue portfolio layout in Adobe Photoshop.</p> <a href = "#"><img src = "images/read_more.png" alt = "read more"></a> </div> <div class = "content_footer"> <div class = "prev"> <div class = "post"> <span>BEAUTIFUL</span> <p>WebDesignFan is a design related blog about web design, photoshop, freebies and tutorials. We publish useful information dedicated to web designers and developers. Here you can find free resources like vectors, wordpress themes and a lot of inspiration.</p> </div> </div> <div class = "prev"> <div class = "post1 "> <span>EFFECTIVE</span> <p>WebDesignFan is a design related blog about web design, photoshop, freebies and tutorials. We publish useful information dedicated to web designers and developers. Here you can find free resources like vectors, wordpress themes and a lot of inspiration.</p> </div> </div> <div class = "prev"> <div class = "post"> <span>FUNCTIONAL</span> <p>WebDesignFan is a design related blog about web design, photoshop, freebies and tutorials. We publish useful information dedicated to web designers and developers. Here you can find free resources like vectors, wordpress themes and a lot of inspiration.</p> </div> </div> </div> </div> </section> <footer> <div class = "footer_bg"> <div class = "copyright">2010 © Fictional Design Studio. Design by Tomas Laurinavičius.</div> <div class = "twitter"> <span><a href = "#">Follow us on Twitter</a></span> <img src = "images/twitter.png" alt = "twitter"> </div> </div> </footer> </body> </html> *{margin: 0; padding: 0;} header, footer {display: block;} body {margin: auto; width: 1000px; height: 800px; background: #ededed url(images/body_bg.jpg) no-repeat center;} img {border: 0;} /**Шапка**/ .header_bg {height: 124px; background: url(images/header_bg.jpg) no-repeat;} .logo img {left: 120px; position: relative; top: 25px;} /**Меню**/ nav.menu ul {margin-left: 467px; margin-top: -39px;} nav.menu ul li {list-style-type: none; display: inline-block; padding: 8px 16px; } nav.menu ul li a {font-family: Myriad Pro, serif; font-size: 18px; color: #959595; font-weight: bold; text-decoration: none;} nav.menu ul li.current {background: rgba(0,0,0,0.5); border-radius: 4px; -moz-border-radius:4px; -webkit-border-radius:4px; padding: 7px 16px; color: #d2d2d2; } nav.menu ul li:hover {background: rgba(0,0,0,0.5); border-radius: 4px; -moz-border-radius:4px; -webkit-border-radius:4px; padding: 7px 16px; color: #d2d2d2; } .content_bg {width: 800px; height: 382px; background: url(images/content_bg.png) no-repeat; margin-top:19px; margin-left: 100px;} .content_bg .con img {margin-top: 22px; margin-left: 30px; box-shadow: 2px 1px 5px 2px #203548;} .content_bg .con span {font-family: Arial; font-size: 16px; font-weight: bold; margin-left: 17px; vertical-align: 197px;} .content_bg .con p {font-family: Arial; color: #fff; font-size: 12px; line-height: 24px; padding-left: 303px; padding-right: 267px; margin-top: -191px; margin-left: -16px;} .content_bg h1 img {margin-top: 20px; margin-left: 31px;} .content_bg .con a img {border: 0; box-shadow: none; margin-top: -20px; margin-left: 171px; margin-top: 4px;} .prev {display: inline-block;} .prev .post {margin-left: 17px; position: relative; top: -20px;} .prev .post1 span {margin-left: 17px;} .prev .post p {margin-top: 9px; width: 252px; font-size: 12px; color: #191919; line-height: 20px; font-family: Arial;} .prev .post1 p {margin-left: 18px;width:221px;margin-top: 9px; font-size: 12px; color: #191919; line-height: 20px; font-family: Arial;} .prev .post span {font-family: Myriad Pro, serif; font-size: 24px; color: #191919; letter-spacing: -1px; vertical-align: -35px;} .prev .post1 span {font-family: Myriad Pro, serif; font-size: 24px; color: #191919; letter-spacing: -1px; vertical-align: -35px;} .content_footer {width: 800px;} /**Футер**/ footer {position: relative; top: 204px;} .footer_bg {height:71px; background: url(images/footer_bg.jpg) no-repeat;} .copyright {font-family: Arial; font-size: 12px; color: #959595; margin-left: 120px; padding-top: 29px;} .twitter {margin-left: 645px; margin-top: -57px;} .twitter span a {text-decoration: none; color:#d4d7dc;} .twitter span a:hover {color: #878884;} .twitter span {display: inline-block; background: #000; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; background: rgba(0,0,0,0.5); font-family: Arial; font-size: 12px; color:#d4d7dc; padding: 6px 8px;} .twitter img {position: relative; bottom: -23px; left: 8px;} Хорошо отображается в ie 8-9, хроме, мозиле. В опере не смотрел. Но вот в ie7 ужас! Может кто подскажет, как исправить? Заранее спасибо!
