Все заметки с тэгом «CSS»

Можно уточнить:
    1. Четверг, 12 августа

      Странная рамка вокруг input[type=submit] в Opera

      Opera, в отличие от IE, не так часто «радует» странностями, но иногда, как и у остальных браузеров, случается.

      Тестовый наборчик (воспроизводится на последнем релизе, Windows)

      При фокусе на input[type=text] вокруг submit появляется чёрная однопиксельная рамка. Так как для кнопки использован border-radius, а рамка у нас прямоугольная, логично предположить, что это не border. Также проверил, что это не outline.

      Вадим Макеев подтвердил, что это такая фича, означающая, что форма в данный момент находится в фокусе, а кнопка с чёрной рамочкой её сабмитит. Работает это таким образом только на Windows. Ну и так как такое поведение желательно не всегда, в будущих версиях рамочка либо будет убрана совсем, либо будет документирована и её будет возможно убрать.

      Пока же единственный способ решить данную проблему — обернуть кнопку дополнительным элементом, задать самой кнопке border: none, а обёртке соответствующий border и border-radius.


    1. Среда, 14 июля

      CSS3PIE

      Появилась альтернтива ie-css3.htc, добавляющего IE поддержку теней от блока и текста и уголков CSS3.

      На данный момент в CSS3PIE поддерживаются:
      - border-radius.
      - box-shadow.
      - border-image.
      - несколько background.
      - линейный градиент как фон.

      Планируется поддержка других возможностей.

      Пользуемся

      , ,

    1. Суббота, 10 июля

      Все префиксированные CSS-свойства на одной странице

      Peter Beverloo собрал полезную табличку, показывающую префиксированные CSS-свойства для Gecko (FF), WebKit (Safari, Chrome), Presto (Opera) и Trident (IE).

      Рассматриваем


    1. Среда, 23 июня

      Кроссбраузерный градиент

      Онлайн-генератор, позволяющий получить код кроссбраузерного градиента.

      Для IE используется фильтр, растягивающий PNG. Для Opera — SVG.

      Пользуемся


    1. Среда, 19 мая

      Шрифты, веб и Google

      Сегодня Google обрадовал сразу несколькими проектами:

      Google Font API — API для удобного кроссбраузерного подключения нестандартных шрифтов. Использовать очень просто:

      <html>
      <head>
      <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine">
      <style>
      body {
      font-family: 'Tangerine', serif;
      font-size: 48px;
      }
      </style>
      </head>
      <body>
      <h1>Making the Web Beautiful!</h1>
      </body>
      </html>



      За кулисами происходит определение браузера и подсовывание ему нужного формата CSS и шрифта.

      Google Font Directory — набор довольно качественных свободных шрифтов, которые можно использовать при помощи Font API как в открытых, так и в коммерческих проектах.

      WebFont Loader — JavaScript библиотека, которая позволяет выйти за рамки стандартного Font API: использовать шрифты typekit и свои шрифты. Также есть некоторое количество полезных callback-ов.

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

      Ссылки по теме:
      - Introducing the Google Font API & Google Font Directory
      - Introducing the WebFont Loader in Collaboration with Typekit
      - Typekit and Google Announce Open Source Collaboration
      - Details on the new Google Webfont API


    1. Среда, 5 мая

      IE9 preview 2

      Вышла вторая превью-версия IE9.

      Из свежего:
      - 10 новых демок.
      - CSS3 Media Queries.
      - getElementsByClassName.
      - DOMContentLoaded.
      - ACID 3: 68/100.

      - Обсуждение на хабре
      - Полный список изменений
      - Пробуем


    1. Четверг, 22 апреля

      Дестктопные Opera Mobile 10 и Opera Widgets Mobile Emulator

      Отличное пополнение в наборе тестовых инструментов для сайтов. Opera зарелизила дестктопные Opera Mobile 10 и Opera Widgets Mobile Emulator для Windows, Linux и Mac.

      Подробное описание на английском
      Пользуемся

      Замечательно было бы заполучить в дополнение эмулятор Opera Mini, но пока придётся всё также тестить через апплет Java.


    1. Вторник, 30 марта

      Алексей Черенкевич, приёмы вёрстки

      Алексей Черенкевич делится своим опытом вёрстки. Подход вполне интересный, но относиться, как и ко всей остальной информации, стоит критически.

      Читаем


    1. Среда, 24 марта

      Максимальная ширина элемента в Opera

      Максимальная ширина элемента в Opera — 32766px.

      Достаточно почти для всех, но всё-таки не очень приятно.


    1. Вторник, 16 марта

      IE9 preview

      Вот нам и показали IE9. От финала он, конечно, далёк, но посмотреть есть на что.

      - Более быстрый, чем в IE8, JavaScript-движок.
      - Поддержка некоторых фич CSS3: border-radius, RGBA, opacity, селекторы. К релизу обещают доделать ещё.
      - Поддержка HTML5: новые элементы, перехлёст тэгов, изменено поведение script и style (теперь можно получить их текст через DOM), API для выделения текста.
      - DOM L2 и немного DOM L3 (Events).
      - Поддержка SVG.
      - DirectX для рендеринга страниц.
      - Улучшена производительность отладчика, добавлен профайлер HTTP.

      Для того, чтобы зарабоали приятные дополнения, надо перевести IE в новый document mode — IE9, например, при помощи:

      <meta http-equiv="X-UA-Compatible" content="IE=IE9" />


      или

      <meta http-equiv="X-UA-Compatible" content="IE=edge" />



      Полный список изменений
      Пробуем

      На работу установленного в системе IE никоим образом не влияет. Устанавливать можно не опасаясь повреждения системы.


  1. 1
  2. 2
  3. 3
  4. Последняя

Подписаться на RSS

Интересное

Разделы

  1. (5)
  2. (11)
  3. (6)
  4. (9)
  5. (6)
  6. (6)
  7. (16)
  8. (60)
  9. (274)
  10. (52)
  11. (16)
  12. (12)
  13. (37)
  14. (6)
  15. (10)
  16. (14)
  17. (18)
  18. (16)
  19. (7)
  20. (8)
  21. (7)
  22. (7)
  23. (31)
  24. (76)
  25. (27)
  26. (68)
  27. (5)
  28. (203)
  29. (59)
  30. (6)
  31. (19)
  32. (73)
  33. (27)
  34. (70)
  35. (33)
  36. (10)
  37. (5)
  38. (6)
  39. (5)
  40. (341)
  41. (14)
  42. (11)
  43. (6)
  44. (13)
  45. (8)
  46. (18)
  47. (6)
  48. (15)
  49. (115)
  50. (18)
  51. (6)
  52. (9)
  53. (71)
  54. (16)
  55. (6)
  56. (25)
  57. (13)
  58. (5)
  59. (39)
  60. (7)
  61. (31)
  62. (7)
  63. (12)
  64. (11)
  65. (124)
  66. (34)
  67. (5)
  68. (18)
  69. (28)
  70. (9)
  71. (6)
  72. (8)
  73. (41)
  74. (10)
  75. (6)
  76. (12)
  77. (5)
  78. (9)
  79. (6)

Друзья