Jump to content
  • Sign Up

Search the Community

Showing results for tags 'css'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML и CSS
    • Проблемы верстки
    • Препроцессоры, постпроцессоры и шаблонизаторы
    • Методологии
    • Фреймворки и библиотеки
  • JavaScript
    • Для начинающих
    • Фреймворки и библиотеки
    • Скрипты и плагины
  • Разработка сайтов
    • Для начинающих
    • Инструменты разработки, сборки и автоматизации
    • Аудит и анализ кода
    • Программное обеспечение разработчика
    • Веб-дизайн
    • Мобильные платформы
    • Open Source
  • Серверное программирование
    • Для начинающих
    • PHP
    • Платформы и языки программирования
    • Базы данных
    • Скрипты, готовые движки, CMS, конструкторы
  • Полезное
    • Библиотека полезных приемов и решений
    • Ресурсы
  • Сервер
    • Техническая поддержка
    • Веб-сервер
    • Базы данных
    • Хостинг
    • Домены
  • Интернет-маркетинг, SEO
  • Коммерческие услуги
  • Давайте поговорим о ...
  • Наш форум

Calendars

  • События форума
  • События партнёров
  • Все события

Blogs

There are no results to display.

There are no results to display.

Marker Groups

  • Members
  • Front-end
  • Back-end
  • Education
  • Looking for job
  • Offering job

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Web site


ICQ


Jabber


Skype


From


Interests

Found 1,132 results

  1. Как правильно сверстать картинки(руку, лист салата и тд) на данном шаблоне? Интересуют именно первые 3 изображения, а именно тарелка, рука с дошиком и лист салата. Тарелку можно просто сверстать допустим на флексах разбив блок на 3 столбца. Но вот интересно как сверстать две оставшиеся картинки так еще и с текстом. Я подумал, что можно также сверстать на тех же флексах разбив на те же 3(в случае с рукой) и 2(в случае с листом салата) колонки флекс сетку, но в таком случае изображения толкали бы друг друга так как рука с тарелкой и лист салата имеют общую площадь расположения на странице. Как это сделать? Помогите пожалуйста, может какое-то свойство прилипания или вообще другой метод верстки?
  2. Подскажите пожалуйста. Коньент с картинкой и абзацем скрываются под футером.
  3. Всем привет. Слышал советы, что вместо пикселей желательно использовать rem для задания размеров. Решил, в качестве эксперимента, попробовать задать для html определённый размер в пикселях, а дальше везде использовать уже rem. И вроде всё нормально, даже очень удобно. Но под конец решил я уменьшить масштаб страницы и вот тут появились проблемы. Если использовать такой код: html { font-size: 10px; } .box { background: red; width: 100px; height: 400px; } То по итогу всё нормально, сколько масштаб не уменьшай, результат всё те же 400px. Но стоило изменить единицы измерения в высоте: html { font-size: 10px; } .box { background: red; width: 100px; height: 40rem; } И вот тут уже появляется проблема. При уменьшении масштаба страницы до 50% к размеру высоты: в Google Chrome и Yandex браузерах добавляется дополнительные 80px, в Opera итоговая высота элемента увеличивается до 960 px. А вот в Firefox всё нормально и по итогу выходят те же 400px. Подскажите в чём тут проблема? Это особенности rem или браузеров на основе WebKit? И вообще, я понимаю, что многие советуют явно высоту элементов не задавать, но если это необходимо, то какие единицы измерения посоветуете для этого использовать?
  4. Пример сайта по разработке reactiq точка net Цена на разработку 70 000 рублей. Без дизайна и верстки, от вас нам нужен функционал на фреймворке Lavarel Нужно постараться уложиться в 20 дней по срокам. Работа по Сделке без риска. B и больше ни как. Основные моменты работы сайта: авторизация сайта через стим считывания апи через официальный сайт pubg Трейдов скинов и все остальное не будет! подключить систему оплат создание личного кабинета для пользователя. Есть полное ТЗ проекта, которое мы готовы упрощать на первом этапе.Готовы достойно оплачивать ваш труд! Пишите в телеграм @evgensalyah
  5. Ищем талантливого программиста в игровой проектДля разработки игрового проекта требуются талантливые программисты.Отличное знание: PHP, JavaScript, PythonПреимуществом будет если когда-то работали с платформой steam и с голосовым мессенджером Discord.Вкратце о проекте: Будет разрабатываться площадка для проведения турниров по играм pubg, dota, cs go.Ищем программиста с руками. Не важно какой вы ориентации, вероисповедания и т.д. Нам от вас важен результат!Готовы достойно оплачивать ваш труд! Пишите в телеграм @evgensalyah
  6. Начальство отдало фрилансерам несколько млн. рублей за данный сайт (beta.sintez.io), при этом анимация кнопки на главной странице рваная и дерганная, конец одного состояния кнопки не попадает в начало зацикленной части. Так как на сайте очень много графических элементов и анимаций, было принято решение сделать прелоадер, после загрузки которого должна начаться анимация всех элементов сайта, плавно, без дерганий и потерь кадров, особенно это касается главную кнопку (кнопка PLAY) в центре на первом экране. Она имеет 3 состояния - 1. появление(24 кадра), 2. основная анимация(48 кадров), 3. наведенное состояние. Проблема в том, что после загрузки прелоадера, анимация "появления" начинается либо не с первого кадра, либо "основная анимация" начинается не дождавшись завершения анимации "появления", то есть, две анимации накладываются друг на друга, в итоге получаем "рваную анимацию", потерю кадров и в общем не корректную работу данной кнопки. РЕФЕРЕНС ПРАВИЛЬНОЙ РАБОТЫ КНОПКИ: https://youtu.be/Eckeyw7VDtk Фрилансеры сваливают эту проблему на "слишком большое количество графических элементов и анимации", а так же, что существующие веб-технологии и суперкомпьютеры не способны плавно воспроизвести анимацию состояющую из двух небольших WEBP файлов. Действительно ли это так? Если нет, то в чем ошибка в текущей версии?
  7. Можно ли с помощью css выровнять блоки одинакового по уровню ? вот картинка. Высота блока должна быть не фиксированной .Контент может быть в любом количестве . Блоки с контентом должны быть на одном уровне . Т.е независимо сколько символом в контенте , описание строго на одном уровнем с другим описание , цена на одном уровне с ценой. Каким способом можно реализовать данное решение ? спасибо за внимание.
  8. Здравствуйте, я бы хотел использовать пиксельных шрифт на сайте, скачал его из интернета, но не понял как использовать его. Интернет обсёрфил, не нашёл. Помогите пожалуйста.
  9. Всем привет, подскажите пожалуйста как добиться такого эффекта при наведении как на видео. Заранее всех благодарю. ScreenRecorderProject2.mkv
  10. Добрый вечер. Чтоб не спамить разными сообщениями на форуме создам все тут. #Вопрос 1. Я пока не нашел ответ в гугле, спрошу тут и пойду искать дальше. Шапка сайте идет на всю ширину экрана(лого и форма поиска). а вот ее сайт(статьи меню и т.д) идут в блоке с каждой стороны примерно по 10% ширины нет(как margin я как понимаю) и там ничего не должно быть активно. там будет свой фон. Вот как можно это сделать сразу? я подумал сначала сделать в body убрать по 10% с каждой стороны но у меня там шапка. На текущий момент кроме как когда создавать блоки с контентом их каждый в писать ширину и поля с отступами. Подскажите как это сделать сразу же заранее.
  11. Добрый день. Создал меню горизонтальное и по макету нужно сделать между меню полоску. как должно выглядеть: Фото меню Я ее добавил в <li>border-right: 1px solid #fff. и у последней ссылки ее нужно убрать. как сделать чтобы рамка не виднелась??? хотел отдельно последний пункт меню взять в ид и убрать ее. но чтото не получается. <li id="contact_us"> <a href="#">CONTACT US</a> </li> кроме как вставлять блок или картинку чтоб замазать ничего не приходит в голову. подскажите пожалуйста реально ли ее убрать через стили ?
  12. Здравствуйте! Помогите, пожалуйста! Что нужно исправить (добавить) в коде, чтобы было как на изображении снизу? Спасибо!
  13. Доброго дня всем матерым верстальщикам. Есть задача сделать табличку графика на сайт. Технологии - понятно, что html и css. Табличка не большая, но с особенностями. А именно, в табличке есть группы объединенных ячеек, при чем не только внутри строк, но и между строками (объединяется несколько строк). Табличку прикрепил. Каркас table tr td без объединения ячеек могу сделать, но нужно объединить. Как правильнее всего сделать такое объединение? Было бы классно, чтобы ответ был сразу с примерами.
  14. Здравствуйте ! Имеется принципиальный вопрос о выравнивании внутри блока шрифтовой иконки . Вопрос трудно объяснить с помощью текста, поэтому прикрепляю видеовопрос для наглядности - (видео чуть более минуты). https://drive.google.com/open?id=1zHWLnroXsaO5TocvUt07Wv6DHauZdBqJ Заранее спасибо за ответ!
  15. Здравствуйте уважаемы знатоки. Заканчиваю верстку галереи, но возникла пара неприятных моментов. Первый. Это проблема вертикального позиционирования "плюса" на оверлее элемента галереи. На контейнере с плюсом у меня простые правила: position: absolute; top: 42%; left: 41%; , на скрине видно, что на верхнем элементе все выглядит как нужно, но у нижнего плюс расположен вертикально не по центру. У остальных элементов галереи такая же ситуация. Конечно есть вариант создать для каждого размера изображения свой класс, и прописать там индивидуальные координаты, но для начала решил спросить у ведующих. Какой универсальный вариант решения данной задачи? Потому-что всех размеров не предусмотришь чтобы для всех создавать классы. И вторая проблема. Это непонятный нижний отступ (помечен стрелочками) от изображения до края блока, в котором лежит изображение. Блоку я ни ширину, ни высоту не задавал, вот его правила: margin-bottom: 29px; display: inline-block; position: relative; , у изображений вообще никаких правил, это их исходные размеры. Но отступ почему-то имеется и так у каждого элемента галереи. Заранее спасибо за помощь.
  16. Здравствуйте. Я занимаюсь версткой сайтов: лендингов, интернет-магазинов, флаеров и тп. Ищу работу, для набора опыта и заработка первых денег на данной позиции. Мое портфолио: https://alex2033.github.io/sites/BlackDone/index.html https://alex2033.github.io/sites/Sandeo/index.html https://alex2033.github.io/sites/Barbershop/index.html https://alex2033.github.io/sites/Skylith/index.html https://alex2033.github.io/sites/Unicorn/index.html https://alex2033.github.io/sites/Bouncy/index.html Остальные работы вы можете посмотреть здесь: https://alex2033.github.io/ Навыки: - Знание HTML5, CSS3 - Опыт адаптивной, семантической, кроссбраузерной верстки - CSS3 анимация - знания Javascript на уровне jQuery - Использование препроцессоров LESS/SASS/Stylus + Pug - Опыт работы в Adobe Photoshop, Illustrator, Zeplin, Avocode - Именование классов по методологии БЭМ-нейминг - Gulp, npm, bower - Умение работать с сетками (bootstrap 3+, foundation, flexboxgrid) - Умение работать с фреймворками bootstrap 3, 4, foundation - Знание английского на уровне чтения документации - Навык работы с векторной графикой SVG - Умение использовать flexbox, css-grid там где это необходимо Форма связи: Email - XoxlofAlexandr@yandex.ru - преимущественно Skype - Xronaliz Также можете написать на этом сайте Благодарю за внимание и хорошего дня:)
  17. Нужно расположить Звездочки рейтинга внизу поцентру внутри блока. Я только начинаю разбираться. Не судите строго пжл. Делаю всё в wordpresse. Можно ли присвоить css класс звездочкам и присвоить css класс блокам и потом в редакторе css сделать такое правило звездочки распологаются внутри, снизу, поцентру блоков. Если да то какой командой? нашел решение .zvezda { position:absolute; top:100%; left:50%; transform: translate(-50%, -50%);
  18. div блок постоянно съезжает, хотя опробовал все. Ответы, что я находил не помогали, смена позиционирования тоже. Может, кто знает как это исправить? Код прилагаю HTML CSS
  19. Доброго тебе дня, друг. Данную тему написать меня сподвигло больше кол-во однотипных тем на тему "Ищу наставника", "Нужен учитель" и тому подобное. Одной из причин тому статья "Путь верстальщика" от автора Максима Усачева, в которой он делится своим безценным жизненным опытом. Я постараюсь пролить свет на некоторые важные (в рамках данной темы) моменты из статьи. Макс пришел на форум имея минимум знаний в сфере разработки и имея большое желание учится. Он упоминает про наставника, но большинство читателей, к сожалению, трактуют данную информацию извращенно. Это не путь к руководству, это всего лишь опыт который получил автор статьи. Нужто ты думаешь, что если и у тебя будет наставник, то ты выучишь все в 2, 3, 10 раз быстрее? Или больше? Или качественнее? Более того, наставник может научить тебя плохому. Наставник в разрезе данной статьи -- это специалист, который допустил огромное кол-во ошибок, который "кровью и потом" работал до глубокой ночи ведя жесткую борьбу с браузерами для достижения своей цели. И хотя результат боя не всегда был на стороне разработчика, войну он всегда выигрывает. Зачем тебе наставник? Что бы он говорил тебе где ты ошибся? Или как надо было сверстать тот или иной блок? Или что лучше использовать float или inline-block? И что это тебе даёт? Набор правил и готовых решений как надо делать и как не надо! Но ведь ты знаешь что каждый сайт уникален, и везде есть нюансы. И ты хочешь каждый раз обращаться к учителю что бы тот подсказал тебе как решить задачу?... Разве ты не хочешь научится думать и понимать чем живет вёрстка? Как она устроена, что из себя представляют слои, понимать и визуализировать и процесс разработки? Понимать "физику" работы блоков на страницы, как и почему они влияют на остальные? Предугадывать на будущее как потянется страница/блок в случае наполнении его контентом. Уметь за считанные секунды в голове разложить огромный сайт на слои? Достичь понимания вёрстки как некой сущности, которая является единым целым с тобой. Другими словами -- ты желаешь женится на прекрасной девушке, со своим темпераментом, безграничными возможностями, уникальным подходом. Она способна подстраиваться под тебя так как ты этого хочешь, когда только пожелаешь. Она согласна выполнять твои прихоти, она не переборчива и соглашаеться на любые твои даже самые безумны идеи. И не смотря на это у неё свой уникальный неповторимый характер. Она бывает упёртая и неприступная, но всегда можно найти с ней общий язык. Если ты знаешь как с ней общаться, понимаешь как она думает, чувствуешь её, чувствуешь то что чувствует она, видишь то что видит она. Если ты слышишь и понимаешь её, то невозможно будет представить цели, которую вы вместе не смогли бы достичь. Ты хочешь женится на самой прекрасной девушке, но спать с ней будет твой наставник! Я не говорю что ты не сможешь стать специалистом без него. Большинство разработчиков, которые поддерживают этот форум, не имели никаких учителей. Все чего они добивались -- все делали сами. Для того что бы достичь тех же высот тебе надо повторить успех людей которые это уже сделали! Это не просто, но это реально! Никто за тебя этого не сделает, никому кроме тебя это не надо. Далее по списку: 1. Перед тем как открыть свою тему в поисках Наставника, пройдись по темам которые создали раньше. 2. Ты ищешь классного специалиста, который будет тебе помогать тебе, обучать, давать советы, делится опытом и знаниями. Ты этого хочешь? А ты можешь ответить на вопрос - зачем вообще кому-то это делать? Зачем, для чего, почему кто-то должен согласится тратить на тебя время? Ведь тебе нужен не новичек как ты, а тот, у кого за плечами багаж опыта, ведь так? Так вот чем ты отличаешься от других таких же жаждущих что бы вкладывать в тебя время и делится нажитым опытом? Пойми правильно, дело то не в деньгах, тут важна идея. 3. Теперь по теме. 3.1. Зачем тебе вообще это направление? Что оно тебе даст? Что ты нашел в вёрстке? 3.2. Если ты считаешь что вместо тебя будет гуглить наставник -- ты ошибаешься. Гугл -- лучший твой помошник. Умеешь правильно составить запрос - умеешь решать задачи. Очень часто бывает так, что поиск решения намного приоритетнее, нежели знания. 3.3. Если ты считаешь что наставник будет тебе давать задания -- ты сильно ошибаешься. Тебе надо -- ты ищи макет, а наставник тебе может написать ТЗ, а потом сказать какая ты бестолочь, указав на твои ошибки в результате -- а это бесценно! 3.4. Любой опыт забирает много времени. Ты не станешь специалистом через год-два! Ты уверен что у тебя вообще хватит сил на то что бы потратить ~5 лет своей жизни в интенсиве и "выкарабкатся" на уровень, когда ты сможешь сверстать страницу (предположим сайта новостей с огромным кол-во блоков) в уме за считаные секунды? Ты уверен что ты хочешь потратить часть своей жизни на изучение вёрстки? ps: нет ничего невозможного, было бы желание
  20. Добрый день. Очень нужен совет. Есть макет лэндинга, ничего в принципе сложного, но не могу понять, как лучше реализовать некоторые элементы (выделил красной рамкой на пикче). Либо с помощью svg, но тогда сложно будет редактировать толщину линий при адаптиве. Либо создавать div'ы и стилизовать их. Или не заморачиваться и запечь эти элементы с фоновый изображением. Делаю тестовое для собеседования, хочется грамотно к вопросу подступить. Как вы реализуете подобное? Лично я первый раз с таким дизайном в практике встречаюсь, вот и колеблюсь. Заранее спасибо.
  21. Всем привет :) Пытаюсь сверстать свой первый макет, и возникла проблема с меню. Должно быть, как на первой картинке - это макет из фш. Выходит, как на второй, меню спадает вниз. Прошу, пожалуйста, тыкните на ошибку в коде, и, если есть возможность, объясните. буду очень рада ответам! Код кидаю: *{margin: 0; padding: 0; outline: 0} .clearfix::after { content:""; height: 0; display: block; clear: both; } div .container { width: 1300px; margin: auto; background: #fff; } header { width: 100%; height: 130px; border-top: 8px solid #a292b3; position: fixed; z-index: 2; } .logo { margin: 30px 0 20px 170px; } .menu { float: right; margin-right: 145px; } .menu li { display: inline-block; list-style: none; padding: 35px; }
  22. Работаю верстальщиком за небольшую плату (100-300руб в зависимости от работы) Связь со мной : VK vk.com/artakagrand Telegram @artakagrand email fefsert@gmail.com Примеры работ: http://teslamodelx.epizy.com http://teslamodelx.epizy.com/infoblog/index.html http://teslamodelx.epizy.com/blog/index.php
  23. В статье BEM с человеческим лицом есть комментарий: кто что думает по этому поводу?
  24. Здравствуйте. Есть абсолютно спозиционированный элемент, во всех браузерах при адаптации все ок(хром, фф, ие), но у заказчика на сафари этот элемент немного поехал. Вопрос: Можно ли сидя на винде как то протестировать вёрстку в сафари?(в актуальной версии браузера) И ещё: что за баг с позиционированием если хром и сафари на одном движке?
  25. Здравствуйте. Подскажите пожалуйста, что стоит дописать в скрипт чтобы файл сохранялся со стилем(css). Есть свой скрипт и есть взятый из jq(https://www.jqueryscript.net/other/Export-Html-To-Word-Document-With-Images-Using-jQuery-Word-Export-Plugin.html). function Export2Doc(element, filename = ''){ var preHtml = "<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='http://www.w3.org/TR/REC-html40'><head><meta charset='utf-8'><title>Export HTML To Doc</title></head><body>"; var postHtml = "</body></html>"; var html = preHtml+document.getElementById(element).innerHTML+postHtml; var blob = new Blob(['\ufeff', html], { type: 'application/msword' }); var url = 'data:application/vnd.ms-word;charset=utf-8,' + encodeURIComponent(html); filename = filename?filename+'.doc':'document.doc'; var downloadLink = document.createElement("a"); document.body.appendChild(downloadLink); if(navigator.msSaveOrOpenBlob ){ navigator.msSaveOrOpenBlob(blob, filename); }else{ downloadLink.href = url; downloadLink.download = filename; downloadLink.click(); } document.body.removeChild(downloadLink); }
×
×
  • Create New...