CSS 创建

CSS 创建

浏览器在读取到一个CSS的时候,会根据这些CSS来定义HTML的内容如何展示。

那么我们怎样添加样式呢?

有三种方法可以添加样式:

  • 内联样式(Inline style)
  • 内部样式表(Internal style sheet)
  • 外部样式表(External style sheet)

那么内联样式怎么添加呢?

内联样式有一些缺陷,会损失掉样式表的优势,所以尽量不去使用内联样式呢,如果你的样式只在元素上使用一次,那你可以考虑使用内联。

我们通常使用style属性来定义内联样式,style属性中包含所有的CSS属性。
举例说明,我们怎样改变一个标题的颜色和右边的举例呢:

<h1 style="color:red;margin-right:5px">标题内容。</h1>

那么内部样式表怎么添加呢?

内部样式表我们一般使用在,有单个的文档需要一些特别的样式的时候。
我们通常使用

<head>
<style>
hr {color:red;}
p {margin-right:5px;}
body {color:url("images/test.gif");}
</style>
</head>

那么怎样添加外部样式表呢?

外部样式表一般用于,有很多的页面都需要使用样式的时候,我们可以定义一个通用的样式文件来灵活的改变整个页面的样式。举例说明:

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

浏览器运行的时候会从testStyle.css中读取文件的样式,然后展示网页的内容。
举例文件样式表的样子:

p{color:red;}
test {margin-right:5px;}
test1 {background-image:url("/images/test.gif");}

注意: 不要在属性值与单位之间留有空格(如:“margin-right: 5 px” ),正确的写法是 “margin-right: 5px” 。

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

三季人 G

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值