<!--1.代码为:-->
<!--<html> <head> <title>内联定义</title> </head> <body> <p style="border:2px solid #000000">内联定义</p> <p style="color:red">内联定义</p> <p style="font-size:12px">内联定义</p> </body> </html>-->
<!--2.代码为:-->
<!--<html> <head> <title>链入内部css</title> <style type="text/css"> #myid { width:200px; height:300px; color:red; } .myclass { width:200px; height:300px; color:red; } </style> </head> <body> <p id="myid">链入内部css</p> <p class="myclass">链入内部css</p> </body> </html>-->
<!--3.代码为:-->
<html> <head> <title>链入外部css</title> <link type="text/css" rel="stylesheet" href="style.css"/> </head> <body> <p id="p1">链入外部css</p> <p id="p2">链入外部css</p> <p class="p3">链入外部css</p> </body> </html>
代码3的style.css是和你的html文件在同一个文件夹。
其代码为:
#p1 { border:2px; color:red; } #p2 { border:2px; color:blue; } .p3 { border:2px; color:red; }
在css中
id前面是要加一个#
class前面要加一个.