CSS 基础

css 用途

　　CSS 指层叠样式表 (Cascading Style Sheets)，样式定义如何显示HTML元素。

css 语法

　　

　　选择器可以有三种：

  • HTML 元素 
    p {
color:red;
text-align:center;
}
  • id 选择器 
    #para1
{
    text-align:center;
    color:red;
}

    #para1 h1
    {
        text-align:center;
    color:red;
    }
  • class 选择器 
    .center {text-align:center;}

     

    p.center {text-align:center;}

     

　　通过不同选择器可以指定，特定某个元素、某种元素、某种元素的特定类的格式。

css 注释

　　CSS注释以 "/*" 开始, 以 "*/" 结束。

 

css 应用示例

　　插入样式表有如下3中方法。

  • 外部样式表(External style sheet) 
    <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>外部样式表</title>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

<body>
</body>
</html>

    mystyle.css文件内容：

    @charset "utf-8";
/* CSS Document */
body
{
    background-color:#0000ff;
}

     

  • 内部样式表(Internal style sheet) 
    <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>内部样式表</title>
<style>
body
{
    background-color:#0000ff;
}
</style>
</head>
<body>
</body>
</html>
  • 内联样式(Inline style) 
    <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>内联样式</title>
<style>
</style>
</head>
将html文件，css文件保存在同一目录下，双击
<body style="background-color:#0000ff;">

</body>
</html>

　　

　　将上边文件保存在同一目录下， 双击即可在浏览器中显示，html文件后缀为.html，css文件后缀为.css。

 

　　

 

posted on 2019-05-27 20:40  rivsidn  阅读(111)  评论(0)    收藏  举报

导航