Adding a search capability to a responsive tab holds few surprises. The
styling code is quite readable at this point, with the search box floating to the right.
Html doesn't provide a search symbol, and the W3 Schools example references Font
Awesome for the magnifying glass symbol.
Getting reasonably proficient at reading color codes at this point. The higher the
values, the more pale the color; and anything with three equal values for rgb
will be a shade of grey. (I put the background on a colors for contrast).The shortcut
#ddd for the topnav is acually read as #DDDDDD on Expression Blend rgb(221, 221, 221),
below. ##2196F3 for the Home button has to be some sort of blue; the latter is the only
part of the index that reaches letter specification.
* * *
Specifying input type is very important, and there are of number of recognized values. (Text
is default). The button type is the best known example, and it opens the possibility to tie in a
Javascript function.
* * *
Other detail; specifying text-decoration: none. I am assuming this is a reminder, because not all
browsers recognize these. ( Text decoration is a line through, over, undedr...).
source: W3 Schools
https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_searchbar3
No comments:
Post a Comment