<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>圣诞树</title> <style> #container{ width: 100px; height: 300px; background: blue; } #aa{ width:0px; height: 0px; margin-left: 25px; margin-right: 25px; border-top: 40px solid transparent; border-left: 25px solid transparent; border-right: 25px solid transparent; border-bottom: 50px solid red; } #bb{ width: 0px; height: 0px; border-top: 0px solid transparent; border-bottom: 80px solid red; border-left: 40px solid transparent; border-right: 40px solid transparent; margin-left: 10px; margin-right: 10px; } #cc{ width: 26px; height: 100px; margin-left: 37px; margin-right: 74px; background: brown; margin-bottom: 50px; } </style> </head> <body> <div id="container"> <div id="aa"></div> <div id="bb"></div> <div id="cc"></div> </div> </body> </html>
div id与div class的区别:
1、使用区别
id具有唯一性,在一个网页中同一个命名只能使用一次;
class命名的类可以在一个网页中使用无数次。
2、css中区别
id在css代码中是以“#”井号符号开头命名的类
class在css代码中是以“.”小写句号符号命名开头的类