1>嵌入式css写法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <!-- 嵌入式css写法 --> <style type="text/css">/*选择器*/ p{ color:red; font-size: 30px; } span{ color:green; font-size: 40px; } </style> </head> <body> <a href="" style='color:blue;font-size:40px'>百度</a> <br /> <span>span标签</span> <p>今天是星期天</p> <!-- 行内样式 --> <div style='color:blue;font-size:40px'>今天天气不错</div> </body> </html>
2>引入样式
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <!-- 引入样式 --> <link rel="stylesheet" href="style.css" /> </head> <body> <p>今天是星期天</p> <p>今天是星期天</p> <p>今天是星期天</p> <p>今天是星期天</p> <p>今天是星期天</p> </body> </html>
CSS部分
/*导入样式*/ @import url('base.css'); p{ color:orange; font-size: 50px; } span{ color:green; font-size: 40px; }