ineedhlw

спасибо!

а вот ещё проблема обнаружил, можно ли как-нибудь избавиться от такой "возможности"?

огромное вам спасибо, работает так, как я и хотел! пока ждал ответ, начал смотреть видео от Sorex'а, буду обучаться вёрстке

сайт лежит на локальном сервере. на сайте имеется кнопочка, по нажатию на которую выползает модальное окно, содержащее небольшую формочку. но когда я закрываю модальное окно, то URL становится таким: http://localhost/index.html#close, а при обновлении страницы происходит как бы моментальное открытие модального окна и сразу его закрытие. ну, будто он уже открыт был. нужно чтобы не было такого момента, что он после обновления страницы вызывает-закрывает модальное окно... как исправить? CSS: /* Контейнер */.modal {/* Слой перекрытия */position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,0.5);z-index: 10000;/* Трансформации прозрачности при открытии */-webkit-transition: opacity 500ms ease-in;-moz-transition: opacity 500ms ease-in;transition: opacity 500ms ease-in;/* Скрываем изначально */opacity: 0;pointer-events: none;}/* Показываем модальное окно */.modal:target {opacity: 1;pointer-events: auto;}/* Содержание */.modal > div {width: 500px;background: #fff;position: relative;margin: 10% auto;/* По умолчанию минимизируем анимацию */-webkit-animation: minimise 500ms linear;/* Придаем хороший вид */padding: 50px;-moz-border-radius: 7px;border-radius: 7px;-webkit-box-shadow: 0 3px 20px rgba(0,0,0,0.9);-moz-box-shadow: 0 3px 20px rgba(0,0,0,0.9);box-shadow: 0 3px 20px rgba(0,0,0,0.9);background: -moz-linear-gradient(#fff, #ccc);background: -webkit-gradient(linear, right bottom, right top, color-stop(1, rgb(255,255,255)), color-stop(0.57, rgb(230,230,230)));text-shadow: 0 1px 0 #fff;}/* Изменяем анимацию при открытии модального окна*/.modal:target > div {-webkit-animation-name: bounce;}.modal h2 {font-size: 36px;padding: 0 0 20px;}@-webkit-keyframes bounce { 0% { -webkit-transform: scale3d(0.1,0.1,1); -webkit-box-shadow: 0 3px 20px rgba(0,0,0,0.9); } 55% { -webkit-transform: scale3d(1.08,1.08,1); -webkit-box-shadow: 0 10px 20px rgba(0,0,0,0); } 75% { -webkit-transform: scale3d(0.95,0.95,1); -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.9); } 100% { -webkit-transform: scale3d(1,1,1); -webkit-box-shadow: 0 3px 20px rgba(0,0,0,0.9); }}@-webkit-keyframes minimise { 0% { -webkit-transform: scale3d(1,1,1); } 100% { -webkit-transform: scale3d(0.1,0.1,1); }}/* Ссылка на кнопку Закрыть */.modal a[href="#close"] {position: absolute;right: 0;top: 0;color: transparent;}/* Сбрасываем изменения */.modal a[href="#close"]:focus {outline: none;}/* Создаем кнопку Закрыть */.modal a[href="#close"]:after {content: 'X';display: block;/* Позиционируем */position: absolute;right: -10px;top: -10px;width: 1.5em;padding: 1px 1px 1px 2px;/* Стили */text-decoration: none;text-shadow: none;text-align: center;font-weight: bold;background: #000;color: #fff;border: 3px solid #fff;-moz-border-radius: 20px;border-radius: 20px;-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);box-shadow: 0 1px 3px rgba(0,0,0,0.5);}.modal a[href="#close"]:focus:after,.modal a[href="#close"]:hover:after {-webkit-transform: scale(1.1,1.1);-moz-transform: scale(1.1,1.1);}.modal a[href="#close"]:focus:after {outline: 1px solid #000;}/* Открываем модальное окно */a.openModal {margin: 1em 10px;display: block;width: 150px;background: #ccc;text-align: center;padding: 10px;-moz-border-radius: 7px;border-radius: 7px;background: -moz-linear-gradient(#fff, #ddd);background: -webkit-gradient(linear, right top, right bottom, from(rgb(255,255,255)), to(rgb(230,230,230)));text-shadow: 0 1px 0 #fff;border: 1px solid rgba(0,0,0,0.1);-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.3);-moz-box-shadow: 0 1px 1px rgba(0,0,0,0.3);box-shadow: 0 1px 1px rgba(0,0,0,0.3);}a.openModal:hover,a.openModal:focus {background: -moz-linear-gradient(#fff, #ccc);background: -webkit-gradient(linear, right top, right bottom, from(rgb(255,255,255)), to(rgb(200,200,200)));}#wrapper{ align:left;}HTML: <div id="wrapper"><a href="#example" class="openModal">Написать сообщение</a> <aside id="example" class="modal"> <div> <h2>Жалобы и пожелания</h2> <form action="send.php" method="POST"> <label> <span style="padding-right:10px;"> <h3>Ваше имя:</h3> </span> <input name ="yourname" type="text" required autofocus></label> <div id="send"> <button align="center"> <img src="sendpicture.jpg" alt="Отправить" style="vertical-align:center"> </button> </div> <label> <span style="padding-right:10px;"> <h3>Ваше сообщение:</h3> </span> <textarea name="textarea" required cols="60" rows="7" maxlength="420"></textarea> </label> </form> <a href="#close" title="Закрыть">Закрыть</a> </div> </aside> </div> </div>з.ы. модальное окно делал не собственноручно, я в нем вообще не разбираюсь.

какое отношение РНР имеет к вёрстке?..

слышал тут про какие-то фреймворки... что это? каким лучше пользоваться?

между тегов <head> </head> нужно прописать <meta charset="utf-8"> , вроде бы. попробуйте

наиболее популярным вариантом является php-скрипт.

что есть методология БЭМ? просьба не гнать меня в гугл и прочие места, а вкратце дать ответ на мой вопрос, если имеете ответ - форум для того и создан же.

Годный совет, воспользуюсь им.

Хорошо, тогда практика. Есть идеи с чего начать?.. Пытаться делать что-то своё? (до каких пор? как я пойму, что готов к чему-то большему?) Подучить теорию и работать удаленно на каких-то совсем-совсем жалких проектах?

Нечего нового для себя отсюда не почерпнул, увы. Я понимаю, что прежде всего необходима практика, что лучший источник пояснений это документации. Но ведь нужны именно азы, которые толкают. Перечитывать от А до Я просто сухую документацию и походу дела скручивать велосипед имея при себе только краску да обос**ную палку с двумя колесами - не вариант Я уже осознал, что необходимо хорошо знать в любом случае HTML & CSS & JS, но мне нужны действительно годные "учители".

В этом деле не совсем деревянный, но все же... - обучался по урокам Е. Попова, к тому же очень давно. Хочу серьезно заняться версткой, зарабатывать на этом деньги. Что должен знать толковый фронт-енд разработчик (кажется, так теперь это называется? работа с красивым выводом результата многих строк кода)? И самое главное - где могу этому обучиться? Источники, источники... Сейчас прохожу курсы от html academy, но они какие-то через чур изи.