Инструменты пользователя

Инструменты сайта


вёрстка

Различия

Здесь показаны различия между двумя версиями данной страницы.

Ссылка на это сравнение

Предыдущая версия справа и слева Предыдущая версия
Следующая версия
Предыдущая версия
вёрстка [2009/08/19 13:50]
samdark
вёрстка [2017/01/08 10:46] (текущий)
samdark [Боремся с IE]
Строка 1: Строка 1:
 ====== Вёрстка ====== ====== Вёрстка ======
  
 +===== HTML5 =====
 +
 +  * [[http://​diveinto.html5doctor.com/​|Dive Into HTML5]]
 +
 +
 +===== CSS3 =====
 +  * http://​css3please.com/​
 +  * http://​paulirish.com/​2012/​box-sizing-border-box-ftw/​
 ===== Софт ===== ===== Софт =====
   * [[http://​rmcreative.ru/​blog/​post/​nabor-dlja-testirovanija-vjorstki|Идеальный набор для тестирования вёрстки]]:​ IE6, IE7, IE8, Firefox, Safari, Opera, Chrome. Все виртуализированы и могут работать параллельно.   * [[http://​rmcreative.ru/​blog/​post/​nabor-dlja-testirovanija-vjorstki|Идеальный набор для тестирования вёрстки]]:​ IE6, IE7, IE8, Firefox, Safari, Opera, Chrome. Все виртуализированы и могут работать параллельно.
Строка 13: Строка 21:
  
 ===== Полезные онлайн-инструменты ===== ===== Полезные онлайн-инструменты =====
-  * [[http://csstool.ru/|CSS Layout Generator (Dimox)]]+  * [[http://csstemplater.com/|CSS Layout Generator (Dimox)]] 
 +  * [[http://​www.nealgrosskopf.com/​tech/​resources/​80/​|Nth-Child Visual Calculator]] 
 +===== Фреймворки ==== 
 +  * [[http://​css-framework.ru/​|css-framework]] 
 +  * [[http://​www.designinfluences.com/​fluid960gs/​|Fluid 960 Grid System]] 
 +  * [[http://​www.1kbgrid.com/​|The 1KB CSS Grid]]  ​
  
 ===== Полезные знания ===== ===== Полезные знания =====
   * [[http://​cssing.org.ua/​2005/​06/​09/​css-selectors-weight/​|Вес селекторов в CSS]]   * [[http://​cssing.org.ua/​2005/​06/​09/​css-selectors-weight/​|Вес селекторов в CSS]]
-  * [[http://​www.webdevout.net/​]] +
-  * [[http://​haslayout.net/​]]+
  
 ===== Приёмы ===== ===== Приёмы =====
 +  * [[http://​vitaly.harisov.name/​article/​independent-blocks.html|Вёрстка независимыми блоками]]
   * [[http://​rmcreative.ru/​blog/​post/​podkljuchenie-stilja-tolko-dlja-safari|Отдельные файлы для Opera, Safari при помощи @media]]   * [[http://​rmcreative.ru/​blog/​post/​podkljuchenie-stilja-tolko-dlja-safari|Отдельные файлы для Opera, Safari при помощи @media]]
-  * Элементы с float лезут за пределы блока — overflow: hidden; zoom: 1+  ​* Отдельный файл для Opera можно подключить как type="​opera/​css"​. 
 +  ​* Элементы с float лезут за пределы блока — overflow: hidden; zoom: 1 и [[http://​rotorweb.ru/​mysli-vslux/​saying-goodbye-overflow-hidden.html|более человечные методы]]
   * [[http://​www.webmagazine.biz/​articles/​krossplatformennyj-sposob-perenosa-teksta-code-pre.html|Кроссбраузерный способ переноса строк в code и pre]]   * [[http://​www.webmagazine.biz/​articles/​krossplatformennyj-sposob-perenosa-teksta-code-pre.html|Кроссбраузерный способ переноса строк в code и pre]]
   * [[http://​rmcreative.ru/​blog/​post/​displayinline-block-dlja-vsekh-brauzerov|display:​inline-block для всех браузеров]]   * [[http://​rmcreative.ru/​blog/​post/​displayinline-block-dlja-vsekh-brauzerov|display:​inline-block для всех браузеров]]
  
-  * [[http://​www.cssstickyfooter.com/​|Прилепленный к низу футер]]+  * [[http://​www.cssstickyfooter.com/​|Прилепленный к низу футер]] и [[http://​habrahabr.ru/​blogs/​css/​67493/​|ещё один]]
   * [[http://​habrahabr.ru/​blogs/​webdev/​60665/​|Заменяем стандартный элемент input file]]   * [[http://​habrahabr.ru/​blogs/​webdev/​60665/​|Заменяем стандартный элемент input file]]
 +  * [[http://​sreznikov.blogspot.com/​2009/​08/​1px-rounded-corners.html|Однопиксельные прозрачные уголки]]
 +
 +  * [[http://​blog.sribna.com/​ukrashaem-input-s-pomoschyu-css-prodolzhenie.htm|Украшаем input с помощью CSS]]
  
 ===== Боремся с IE ===== ===== Боремся с IE =====
   * [[http://​www.quirksmode.org/​css/​condcom.html|Условные комментарии]]   * [[http://​www.quirksmode.org/​css/​condcom.html|Условные комментарии]]
-  * [[http://​rmcreative.ru/​blog/​tag/​PNG/​|PNG]],​ лучший из фиксов пока [[http://​rmcreative.ru/​blog/​post/​dd_belatedpng|DD_belatedPNG]] 
   * [[http://​rmcreative.ru/​blog/​post/​whateverhover-v3|hover]]   * [[http://​rmcreative.ru/​blog/​post/​whateverhover-v3|hover]]
-  * IE6 дублирует margin для элементов с float — применяем к ним display: inline. 
-  * Ненулевая высота для элемента с height: 0 — line-height:​ 0 
-  * [[http://​rmcreative.ru/​blog/​post/​perekryvaem-select-v-ie6|Перекрываем select в IE6]] 
  
-===== Вёрстка писем ===== 
-  * [[http://​habrahabr.ru/​blogs/​webdev/​60420/​|10 рекомендаций по html-верстке электронных писем]] 
  
 ===== Покажите это дизайнеру ===== ===== Покажите это дизайнеру =====
вёрстка.1250689812.txt.gz · Последние изменения: 2013/08/01 20:27 (внешнее изменение)