# 037: Обыск зданий, часть 3 - CSS-хитрости

Anonim

Нам нужно еще немного поработать, чтобы завершить поиск.

Мы отвлекаемся всего на секунду, так как я заметил, что мы еще не добавили эффект трехмерного наложения для переноса страницы, поэтому мы делаем это и меняем окраску.

Затем мы работаем над областью «Искать в:», которая представляет собой небольшие ссылки, по которым вы можете щелкнуть, чтобы сузить поиск по какой области сайта. Позже мы заставим это работать, но мы установим для этого пользовательский интерфейс. Ссылки окрашены в голубой цвет, но «выбранная» ссылка становится белой и подчеркивается, что является большим количеством отзывов о том, какой из них выбран.

Мы также добавляем символ ✕ (который мы заимствовали из CopyPasteCharacter) в качестве небольшой ссылки, которую вы можете щелкнуть (или нажать), чтобы закрыть область поиска.

Когда у нас есть готовый дизайн, мы обнаруживаем, что открывать и закрывать область поиска немного неудобно. Когда открытая область поиска временно сужается, все временно замыкается. Чтобы исправить это, мы следим, чтобы ничто не оборачивалось white-space: nowrap;и ничто не выглядело странно oveflow: hidden;.

Я заканчиваю это тем, что мы создадим поисковые системы следующими, но на самом деле мы еще не дошли до этого, это будет около Видео # 094.