CSS基础入门------01-与HTML的3种结合方式

来源：互联网发布：咏春拳教学软件编辑：程序博客网时间：2024/06/05 10:13

<!DOCTYPE html><html>  <head>    <title>01-结合方式1.html</title>    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">    <meta http-equiv="description" content="this is my page">    <meta http-equiv="content-type" content="text/html; charset=UTF-8">        <!--<link rel="stylesheet" type="text/css" href="./styles.css">--><!-- 结合方式1:html标签上加上style属性. 属性的值填写Css代码.所有标签都有style属性. -->  </head>    <body>   <p style="color:red;" > This is my HTML page. </p>  </body></html>

<!DOCTYPE html><html>  <head>    <title>02-结合方式2.html</title>    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">    <meta http-equiv="description" content="this is my page">    <meta http-equiv="content-type" content="text/html; charset=UTF-8">        <!--<link rel="stylesheet" type="text/css" href="./styles.css">--><!-- 结合方式2:使用head标签中的style标签.设置页面样式.style中填写css代码 --> <style type="text/css"> p{ color:red; } </style>  </head>    <body>   <p> This is my HTML page. </p>  </body></html>

<!DOCTYPE html><html>  <head>    <title>03-结合方式3.html</title>    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">    <meta http-equiv="description" content="this is my page">    <meta http-equiv="content-type" content="text/html; charset=UTF-8">    <!-- 结合方式3: -->   <link rel="stylesheet" type="text/css" href="p.css">  </head>    <body>   <p> This is my HTML page. </p>  </body></html>

运行效果如下

阅读全文

0 0