A little confusion about pseudo-class selectors and inline elements_html/css

A little confusion about pseudo-class selectors and inline elements_html/css_WEB-ITnose

WBOY

Release： 2016-06-24 12:18:54

Original

1962 people have browsed it

Pseudo-class selector inline element

First question

#nav li a:link{    display:block;    width:90px;    height:37px;    background:url(images/nav_bg.gif);}#nav li a:hover{    background:url(images/nav_on.gif);}

Copy after login

Why can’t the relationship like #nav li be used if the second one in this code is not written? If you don't write it, doesn't it mean that all a:hover attributes in the page can be used?
The second question

<style type="text/css">#g1{    background:red;}</style></head><body>        <span>        第一行<br />        第二行<br />        第三行<br />        </span>        <div id="g1">我是块状</div> <br />        </body>

Copy after login

When inlining elements, the teacher said that there will be an obvious margin between a large paragraph of text and the block element below. I entered the code casually and did not find the margin. , I only found that there is a margin between the subsequent picture elements and the block elements. Why is this? Is it because different elements have different effects?

Reply to the discussion (solution)

The first question: After testing, it is okay not to write #nav li. . . . . Theoretically it works, but I don’t know what the poster’s situation is, or I can write down the entire code and study it. . .
Second question: I don’t understand what the poster’s teacher said. Enter the following CSS and you’ll know what’s going on:

#g1 {   border:1px dotted #0c0;}span {	border:1px dotted #c00;}

Copy after login

First question: After testing, don’t write #nav li is ok. . . . . Theoretically it works, but I don’t know what’s going on with the original poster, or maybe I can write down the entire code and study it. . .
The second question: I don’t understand what the teacher said. Enter the following CSS and you will know what is going on:
CSS code?123456#g1 { border:1px dotted #0c0;}span { border:1px dotted #c00;}
…

First question? I am #nav li a:hover. Is it okay if I don’t write #nav li in this sentence? But it’s okay not to write the first attribute, right? In theory, not writing it means global coverage, right? But I tried but it didn’t work

The first question: After testing, it is possible not to write #nav li. . . . . Theoretically it works, but I don’t know what’s going on with the original poster, or maybe I can write down the entire code and study it. . .
The second question: I don’t understand what the teacher said. Enter the following CSS and you will know what is going on:
CSS code?123456#g1 { border:1px dotted #0c0;}span { border:1px dotted #c00;}
…
What is your test code? Let me try to run it. My code here is just in and two, and there is nothing else. There is also a CSS introduced. Can you see if this is the problem?

/*css reset code *//****  文字大小初始化,使1em=10px *****/body {font-size:62.5%;} /* for IE/Win */html>body {font-size:10px;} /* for everything else *//*字体边框等初始化*/body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { padding: 0; margin: 0; }table { border-collapse: collapse; border-spacing: 0; }fieldset,img { border: 0; } img { display:block; }address,caption,cite,code,dfn,th,var { font-weight: normal; font-style: normal; }ol,ul { list-style: none; }caption,th { text-align: left; }h1,h2,h3,h4,h5,h6 { font-weight: normal; font-size: 100%; }q:before,q:after { content:''; }abbr,acronym { border: 0; }a {text-decoration:none;}

Copy after login