# css引入方式
1:内嵌方式 <div style="color:red;font-size:100px;">JavaWeb</div> // 不建议使用 不便于后期的维护
2:内部样式,css代码较多时,会影响加载速度 <head> <style type="text/css"> div{ background:red; text:10p; } </style> </head>
3:链入外部样式,开发中非常建议使用 创建文件testcss.css 在文件中编写css内容 dic{ color:green; text:10p; } 在html文件中引入 <link rel="stylesheet" type="text/css" href="testcss.css"/>
4:import链入外部样式(有些浏览器不支持)不支持javascripty动态修改 <style type="text/css"> @import url("testcss.css"); </style>
# css中的选择器
1:元素选择器 <style type="text/css"> span{ text:10p; } </style>
2:id选择器(不可重复) <style type="text/css"> #id1{ background:red; text:10p; } </style> <div id="id1">id选择器</div>
3:class选择器(可重复) <style type="text/css"> .c1{ background:red; text:10p; } </style> <div class="c1">id选择器</div>
4:属性选择器 <style type="text/css"> input[type="text"]{ background:red; text:10p; } </style> <table> <tr> <th>用户名:</th> <th> <input type="text"> </th> </tr> <tr> <th>密码:</th> <th> <input type="password"> </th> </tr> </table>
5:伪元素选择器 <style type="text/css"> a:link{clolr:red} // 静止 a:hover{clolr:blue} // 悬浮 a:active{clolr:green} // 触发 a:visited{clolr:yellow} // 完成 </style>
6:层级选择器 <style type="text/css"> #div1 .d1 span{ background:red; text:10p; } </style> <div id="div1"> <div class="d1"> <span>xxx<span> </div> <div class="d2"> <span>xxx</span> </div> </div>
待完成