CSS(基本运用)

一、CSS是什么

CSS= Cascading Style Sheet,即层叠样式表,是一种指定HTML文档视觉表现的标准。对文档元素的字体、颜色、外边距、缩进、边框、甚至定位进行了列举,即成为了CSS标准中的属性。例如:

body {
    color:white;     /*字体为白色*/
    background-color:black;    /*背景为黑色*/

}

p {

        color:#00ff90;     /*设置p元素(即<p> · · · · · ·</p>)的字体为#00ff90号颜色*/

}

属性还有很多、如:

font-weight:900;    /*设置字体的粗细*/

margin:auto;    /*设置外边区域的厚度*/

· · · · · ·

二、如何使CSS发挥作用

方法1.用<style>和</style>标签把一个CSS样式表(即CSS的语句)抱起来发在head中(即<head>和</head>标签之间)

相当于在头部多了一个面具(style)元素:

<!DOCTYPE html>
<html>    <!--<html xmlns="http://www.w3.org/1999/xhtml">-->
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title>This is a HTML</title>

    <style>       
     body {
       color:white;
       background-color:black;
        }
        p {
        color:#00ff90;}
    </style>

</head>
<body>
    <f>HELLO</f>
        <li>123</li>
        <li>456</li>
    <p> CAN YOU SEE</p>
    <ul id="purchases">
       <li>ABC</li>
       <li>DEF</li>
    </ul>
</body>
</html>

方法2.创建一个xx.css文件,以mystyles.css文件为例。在head中使用<link>标签:

<!DOCTYPE html>
<html>    <!--<html xmlns="http://www.w3.org/1999/xhtml">-->
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title>This is a HTML</title>

    <link href="mystyle.css"/ rel="stylesheet" type="text/css">

</head>
<body>
    <f>HELLO</f>
        <li>123</li>
        <li>456</li>
    <p> CAN YOU SEE</p>
    <ul id="purchases">
       <li>ABC</li>
       <li>DEF</li>
    </ul>
</body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值