LUC
Newbie-
Posts
12 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by LUC
-
CSS по правилам Академии HTML и прочих гуру-верстальщиков
LUC replied to LUC's question in HTML Coding
Спасибо за ответы! Значит буду делать так, как привык) -
CSS по правилам Академии HTML и прочих гуру-верстальщиков
LUC replied to LUC's question in HTML Coding
На 24-дюймовом мониторе при разрешении 1080 пикселей по вертикали умещаются 53 строки CSS. То есть, у меня перед глазами всегда большой объем данных и взгляд охватывает одновременно около 500 свойств. Считаю, что это удобно. Но дело не только в переносе строк. Наличие лишних пробелов мне тоже не понятно. Например, зачем между правилами ставить именно по два пробела? Зачем ставить пробел после двоеточия? Зачем нужна точка с запятой после последнего свойства? Если это улучшает производительность браузера, то имеет смысл взять рекомендации на вооружение. Если же дело только в красоте, то, видимо, вкусы у меня весьма специфичны и я этой "красоты" не понимаю. ? Возможно, я задаю глупые вопросы, но моя профессиональная деятельность никогда не была связана с конвейерным производством сайтов. Поэтому даже такие замечательные штуки как препроцессоры css или фрймворки я могу легко игнорировать. -
Всем привет! Верстаю сайты более 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 строк. Кому как, а лично мне читать такой код совершенно неудобно. Так вот, имеет ли смысл менять свои привычки и переучиваться? Влияют ли все эти дополнительные пробелы и переносы на производительность браузера в лучшую сторону? Или это лишь попытка упростить жизнь верстальщикам-фрилансерам, которым приходится ежедневно вчитываться в чужой код?
-
К содержимому переменной посдтавляется лишний знак вопроса
LUC replied to LUC's question in JavaScript
Искал примеры работы с методом .load(), очутился в этой теме. Оказалось, что создал её сам 2 месяца назад)) С предыдущим вопросом разобрался. Теперь ситуация немного другая. Загружаю блок с id="message": $('#load').load('/ссылка.html #message'); Но вместо селектора нужно подставить переменную. Вот как-то так: $('#load').load('/ссылка.html blabla'); Подскажите правильный синтаксис. Пробовал разные варианты: $('#load').load('/ссылка.html' + blabla); $('#load').load('/ссылка.html' + ' ' + blabla); $('#load').load('/ссылка.html' + ' ' + 'blabla'); Ничего не работает. -
На странице есть блок, с атрибутом 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.
-
Добрый день. Всегда верстал меню так: <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>?
-
Благодарю! То, что нужно.
-
Имеем квадратный (равносторонний) div, внутри него лежит img: <div><img src="" /></div>Нужно сделать так, чтобы картинка растягивалась на весь объем дива и не оставалось пустого пространства, вот так: То есть, если изображение вертикальное, то растягивается по ширине дива, а если горизонтальное - по высоте. При этом края скрываются overflow:hidden. Нужно CSS-решение, без скриптов. P.S. Это должно работать как background:cover, только применительно к img.
-
На странице есть 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>Подскажите чего-нибудь.
-
Не знаю можно ли выкладывать здесь ссылки, поэтому объясню на словах. Сайт активно использует 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 на жесткий цвет, лаги практически исчезли. Вопрос: это особенность современного Хрома или проблема в чем-то другом?
- 1 reply
-
- rgba
- полупрозрачность
-
(and 2 more)
Tagged with:
-
Уникальный стиль полосы прокрутки для отдельного блока на странице
LUC replied to LUC's question in HTML Coding
Именно этой статьей я и руководствовался, но в ней ничего не сказано о возможности сделать на одной странице несколько скроллбаров с разными стилем.- 3 replies
-
- полоса прокрутки
- scrollbar
-
(and 1 more)
Tagged with:
-
Уникальный стиль полосы прокрутки для отдельного блока на странице
LUC posted a question in HTML Coding
На странице установлен уникальный стиль полосы прокрутки (средствами ::-webkit-scrollbar). Нужно немного иначе стилизовать отдельный блок на странице. То есть, чтобы полоса прокрутки внутри него была другого цвета и ширины. Как это сделать?- 3 replies
-
- полоса прокрутки
- scrollbar
-
(and 1 more)
Tagged with: