Confused about CSS selector, please give me some advice_html/css_WEB-ITnose

CSS HTML

CSS and HTML are described as follows








The display effect is as follows:


I am confused about the selectors: input.search and #search_container input:focus

, there are no these elements in

Please give me some advice!

Reply to the discussion (solution)

input.search
represents the input element of class="search" that only works. Other elements have no effect. For example,

will not have any effect

#search_container input
means that all inputs in the id="search_container" element will work

input.search
represents the input element of class="search" that only works. Other elements have no effect. For example,

will not have any effect

#search_container input
means that all inputs in the id="search_container" element will work
1

input.search refers to all input class controls with class "search"

#search_container input:focus

There is indeed no ID of #search_container in the code you gave. This is to find Element by ID.
input:focus pseudo-selector, when the input control is the current focus

Taken together, it is the style of the Input at any position within the element with the ID #search_container when it is focused

Refer to W3C http://www.w3.org/TR/2011/REC-CSS2-20110607 /selector.html

Related labels：

CSS选择器疑惑，求指教

source：php.cn

Previous article：Web page production_html/css_WEB-ITnose Next article：css invalid_html/css_WEB-ITnose

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Latest Articles by Author

• What is a NullPointerException, and how do I fix it?
  2024-10-22 09:46:29
• From Novice to Coder: Your Journey Begins with C Fundamentals
  2024-10-13 13:53:41
• Unlocking Web Development with PHP: A Beginner's Guide
  2024-10-12 12:15:51
• Demystifying C: A Clear and Simple Path for New Programmers
  2024-10-11 22:47:31
• Unlock Your Coding Potential: C Programming for Absolute Beginners
  2024-10-11 19:36:51
• Unleash Your Inner Programmer: C for Absolute Beginners
  2024-10-11 15:50:41
• Automate Your Life with C: Scripts and Tools for Beginners
  2024-10-11 15:07:41
• PHP Made Easy: Your First Steps in Web Development
  2024-10-11 14:21:21
• Build Anything with Python: A Beginner's Guide to Unleashing Your Creativity
  2024-10-11 12:59:11
• The Key to Coding: Unlocking the Power of Python for Beginners
  2024-10-11 12:17:31

Latest Issues

function_exists() cannot determine the custom function Function test () {return true;} if (function_exists ('test')) {echo "test is function...

From 2024-04-29 11:01:01

0

3

2419

How to display the mobile version of Google Chrome Hello teacher, how can I change Google Chrome into a mobile version?

From 2024-04-23 00:22:19

0

11

2549

The child window operates the parent window, but the output does not respond. The first two sentences are executable, but the last sentence cannot be implemented.

From 2024-04-19 15:37:47

0

1

2157

There is no output in the parent window document.onclick = function(){ window.opener.document.write('I am the output of the child ...

From 2024-04-18 23:52:34

0

1

2039

Where is the courseware about CSS mind mapping? Courseware

From 2024-04-16 10:10:18

0

0

2126

Related Topics

More>

• html to txt
• vb.net tutorial
• What to do if the computer desktop icon cannot be opened
• What are the rpc frameworks?
• How to open gff file
• How to enable secondary logon service
• What is a browser plug-in
• The difference between wildcard masking and unmasking