← 返回 sofi 的题目列表Build a Search Bar with HTML/CSS (No Framework)
类型:online_judge
Task: Build a Search Bar UI Using Only HTML + CSS (No Frameworks)
Implement a search bar UI using only HTML and CSS (no frameworks or component libraries).
Functional & structural requirements
The page must contain a search bar area with at least:
a text input (<input type="text">)
a clickable search button (<button>)
The input must have a placeholder, e.g. Search....
Basic usability:
the input can be focused and typed into
the button is clickable
Styling requirements (use any reasonable approach)
The search bar should look like a cohesive component (input and button aligned, borders connect naturally).
Provide a :focus style for the input (e.g., border or shadow change).
The component should not break badly at different widths (at minimum, input and button should not overlap).
Constraints
No backend/data involved.
Only HTML + CSS (may be in a single file).
Submit
The content of index.html (including necessary CSS).