← Все примеры

CSS Разработка и QA quora.com

Quora: обвести карточки ленты (для разработки)

Рисует пунктирную рамку вокруг каждой карточки ленты и выводит её id, упрощая создание своих селекторов.

Код для копирования

/* Developer aid: outline feed cards and label their boxes */
div[class*="q-box"][id] {
  outline: 1px dashed rgba(220, 50, 50, 0.6) !important;
}
div[class*="q-box"][id]::before {
  content: attr(id);
  display: block;
  font: 10px/1.4 monospace;
  color: #b22;
  background: #fff4f4;
  padding: 1px 4px;
}

Как использовать этот пример

  1. Скопируй код кнопкой выше.
  2. Установи JustZix (2 минуты) и открой расширение на нужной странице.
  3. Добавь новое правило, совпадающее с этой страницей.
  4. Вставь код в панель CSS правила и сохрани — эффект появится сразу.

Оцени этот пример

Оценок пока нет — оцени первым.

Этот пример работает?

Сниппеты бесполезны, если их некуда вставить.

JustZix устанавливается за 2 минуты и запускает твой код на каждой подходящей странице. Без аккаунта, без оплаты.

Скачать бесплатно Смотреть применение