Jump to content

LUC

Newbie
  • Posts

    12
  • Joined

  • Last visited

Everything posted by LUC

  1. Спасибо за ответы! Значит буду делать так, как привык)
  2. На 24-дюймовом мониторе при разрешении 1080 пикселей по вертикали умещаются 53 строки CSS. То есть, у меня перед глазами всегда большой объем данных и взгляд охватывает одновременно около 500 свойств. Считаю, что это удобно. Но дело не только в переносе строк. Наличие лишних пробелов мне тоже не понятно. Например, зачем между правилами ставить именно по два пробела? Зачем ставить пробел после двоеточия? Зачем нужна точка с запятой после последнего свойства? Если это улучшает производительность браузера, то имеет смысл взять рекомендации на вооружение. Если же дело только в красоте, то, видимо, вкусы у меня весьма специфичны и я этой "красоты" не понимаю. ? Возможно, я задаю глупые вопросы, но моя профессиональная деятельность никогда не была связана с конвейерным производством сайтов. Поэтому даже такие замечательные штуки как препроцессоры css или фрймворки я могу легко игнорировать.
  3. Всем привет! Верстаю сайты более 10 лет. В основном для себя, не для коммерции. Начинал с табличной верстки, потом плавно перешел на блочную. Но никогда не обращал особого внимания на различные правила и рекомендации со стороны опытных верстальщиков. Мой подход к творчеству был предельно прост: если код проходит валидацию - хорошо. Если юзеры не жалуются на поехавшие блоки - ещё лучше! Однако, время и идет и приходится следовать современным тенденциям. После чтения различных материалов, типа "Стиль кода Академии HTML" , возник ряд вопросов, найти ответы на которые не удалось. В частности, касательно рекомендаций, которые даются в руководстве по написанию CSS. Например, следующие: Вопрос такой: для чего нужны все эти рекомендации? Для лучшей читаемости CSS человеком или браузером? Дело в том, что я всю жизнь пишу каждое правило в одну строку. Вот примерно так: .header {height:500px;font-size:25px} .header-logo {position:absolute;top:25px;left:30px;z-index:10;width:300px;height:300px} .content {padding:10px5px;margin:10px 0} Никаких переносов строк и лишних пробелов. Мне так удобнее читать: слева направо, как книгу. На широкоэкранном мониторе каждое правило умещается на весь экран. Допустим, в CSS прописано 150 правил, в каждом по 10 свойств. Если я каждое свойство перенесу на отдельную строку, CSS растянется на 1500 строк. Кому как, а лично мне читать такой код совершенно неудобно. Так вот, имеет ли смысл менять свои привычки и переучиваться? Влияют ли все эти дополнительные пробелы и переносы на производительность браузера в лучшую сторону? Или это лишь попытка упростить жизнь верстальщикам-фрилансерам, которым приходится ежедневно вчитываться в чужой код?
  4. Искал примеры работы с методом .load(), очутился в этой теме. Оказалось, что создал её сам 2 месяца назад)) С предыдущим вопросом разобрался. Теперь ситуация немного другая. Загружаю блок с id="message": $('#load').load('/ссылка.html #message'); Но вместо селектора нужно подставить переменную. Вот как-то так: $('#load').load('/ссылка.html blabla'); Подскажите правильный синтаксис. Пробовал разные варианты: $('#load').load('/ссылка.html' + blabla); $('#load').load('/ссылка.html' + ' ' + blabla); $('#load').load('/ссылка.html' + ' ' + 'blabla'); Ничего не работает.
  5. На странице есть блок, с атрибутом data-index, в котором прописан адрес страницы: <div id="my_id" data-index="/index/877"></div> Я пытаюсь засунуть содержимое этого атрибута в переменную index и вставить ее в .load(), чтобы подгрузить div-блок с id="message" с той самой страницы: <script> var index = $('$my_id').attr('data-index'); $('#load').load(index,'#message'); </script> Однако, get-запрос не проходит из-за того, что к адресу страницы подставляется лишний знак вопроса, вот так: /index/877? Откуда берётся этот знак вопроса? Кстати, alert(index); выводит корректное значение переменной index.
  6. Добрый день. Всегда верстал меню так: <nav> <a href="#">Пункт меню 1</a> <a href="#">Пункт меню 2</a> <a href="#">Пункт меню 3</a> </nav> Потом полазил по разным сайтам и заметил, что почти все делают такую структуру: <nav> <ul> <li><a href="#">Пункт меню 1</a></li> <li><a href="#">Пункт меню 2</a></li> <li><a href="#">Пункт меню 3</a></li> </ul> </nav> Даже здесь, на вашем форуме, меню оформлено в маркированном списке. Почему? Зачем писать больше лишнего кода? Тег <nav> уже подразумевает, что в нём содержится меню, зачем нужен <ul>?
  7. Имеем квадратный (равносторонний) div, внутри него лежит img: <div><img src="" /></div>Нужно сделать так, чтобы картинка растягивалась на весь объем дива и не оставалось пустого пространства, вот так: То есть, если изображение вертикальное, то растягивается по ширине дива, а если горизонтальное - по высоте. При этом края скрываются overflow:hidden. Нужно CSS-решение, без скриптов. P.S. Это должно работать как background:cover, только применительно к img.
  8. На странице есть input и select: <input id="111" type="text" name="blabla" value="02"><select id="222" name="ololo"><option></option><option value="01">Текст 1</option><option value="02">Текст 2</option><option value="03">Текст 3</option></select>Нужно написать скрипт, который выбирает option со значением value, равным значению value в input'е и подставляет ему атрибут selected. Или, как вариант, можно присвоить значение value из input'а первому (пустому) option из списка. То есть, результатом работы скрипта должно быть следующее: <input id="111" type="text" name="blabla" value="02"><select id="222" name="ololo"><option></option><option value="01">Текст 1</option><option value="02" selected="selected">Текст 2</option><option value="03">Текст 3</option></select>Или: <input id="111" type="text" name="blabla" value="02"><select id="222" name="ololo"><option value="02"></option><option value="01">Текст 1</option><option value="02">Текст 2</option><option value="03">Текст 3</option></select>Подскажите чего-нибудь.
  9. Не знаю можно ли выкладывать здесь ссылки, поэтому объясню на словах. Сайт активно использует border-radius, shadow, transition и прочие эффекты. Страницы с фиксированным фоном (jpg 1920х1080, background-attachment:fixed). Все три колонки имеют полупрозрачный бэкграунд rgba(0,166,156,0.2), некоторые блоки внутри них тоже имеют полупрозрачность background:rgba(0,0,0,0.5). Я заметил, что в базовом Хроме весьма заметно тормозит скроллинг страницы. Другие браузеры на вебките рендерят лучше, но по сравнению с Firefox и Edge все равно не очень хорошо. Я начал с отключения всей анимации и эффектов, радиусов и теней, и в итоге пришел к заключению, что Хром спотыкается о полупрозрачные блоки rgba-фоном, растянутые на всю страницу. После замены rgba на жесткий цвет, лаги практически исчезли. Вопрос: это особенность современного Хрома или проблема в чем-то другом?
  10. Именно этой статьей я и руководствовался, но в ней ничего не сказано о возможности сделать на одной странице несколько скроллбаров с разными стилем.
  11. На странице установлен уникальный стиль полосы прокрутки (средствами ::-webkit-scrollbar). Нужно немного иначе стилизовать отдельный блок на странице. То есть, чтобы полоса прокрутки внутри него была другого цвета и ширины. Как это сделать?
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy