HTMLCSS小白——select复选框，标签选择器，css选择器权重

灰太狼 2023-07-09 05:22 54阅读 0赞

<!DOCTYPE html>
    <html>
    <head>
    	<title></title>
    	
    	
    	<style type="text/css">
    		/*通配符 选择器*/
    		*{
        
    			background-color: white;
    
    		}
    		/*属性选择器*/
    		[id="only"]{
        
    			background-color: black !important; 
    		}
    		/*id 选择器*/
    		#only{
        
    			width: 100px;
    			height: 100px;
    			background-color: red;
    			border-radius: 50%;
    		}
    		/*class选择器*/
    		[class="demo"]{
        
    			background-color: blue;
    		}
    		.demo{
        
    			width: 100px;
    			height: 100px;
    			position: absolute;
    			left: 50px;
    			top: 150px;
    			background-color: green;
    			border-radius: 10px;
    		}
    		.demo1{
        
    			background-color: blue;
    			top: 300px;
    		}
    		/*标签选择器*/
    		span{
        
    			color: red;
    		}
    		
    	</style>
    </head>
    <body>
    	
    
    
    	
    	
    	<div id="only">123</div>
    	
    	<div class="demo">1233</div>
    	<div class="demo demo1"></div>
    	
    	<span>23123</span>
    	
    	
    	
    
    
    
    	<form method="get" action="链接">
    	<select name="province">
    		<option value="beijing">beijing</option>
    		<option value="beijing">yinchuang</option>
    		<option>ningxia</option>
    		
    	</select>
    		
    		
    		
    		
    		
    		<input type="submit" name="">
    
    	</form>
    
    </body>
    </html>