css样式

css 层叠样式表   Cascading Style Sheets

 

• 一般说来所有样式有下面的规则(第四个最有优先性)
1. Browser default
浏览器默认 
2. External style sheet
外部样式表 
3. Internal style sheet (inside the <head> tag)
内嵌样式表(在<head>标签内) 
4. Inline style (inside an HTML element)
行内样式(在一HTML元素内) 

 

外部样式表能够让你改变所有出现在你WEB中的外观和布局,而仅仅通过编辑一个单独的CSS文档.(原理就是一动多变)

 

CSS的语法由三部分组成: 一个选择器,一个属性和一个值,例如:

selector {property: value} 

 

选择器是需要去定义的元素或标签

 

如: body{color:red} 把标签body的 color 属性 定义成 red

 

如果值为多个单词则用双引号括起来
如:p {font-family: "sans serif"}

 

如果指定多个属性 就必须将每个属性用分号隔开

如:p {text-align:center;color:red} 

 

每个HTML元素只能有一个类属性

<p class="right">

可用p.right {text-align: right} 修饰左右class属性为right 的p元素或者标签

 

如果用.right{text-align: right} 则修饰所有class属性为right的元素或者标签,就没有特指一类标签或者元素的意思了。

 

id 选择器

 

<h1 id="属性">

css中可以用

 

#属性 {}  修饰所有 id 属性为 相同的元素或者标签 与class类似 一个是用 . 一个是用 #

class id 的 属性名字不能 以数字开头 不然无法在Mozilla/Firefox正常运作

 

css的注释/* */

 

三种方法可以插入样式表
• 外部样式表(External Style Sheet)

 

<link>标签在head区域使用
<head> 
<link rel="stylesheet" type="text/css" href="mystyle.css" /> 
</head>


• 内嵌样式表(Internal Style Sheet)

 

使用<style>标签在head区域内定义样式,像这样


<head> 
<style type="text/css">  
hr {color: red} 
p {margin-left: 20px} 
body {background-image: url("images/back40.gif")} 
</style> 
</head


• 行内样式(Inline Styles)

 

在相关的标签上用style属性来加入行内样式。样式属性可以包含任何CSS属性。例子中将展示怎样给一个段落加上左间距并将颜色改为red


<p style="color: red; margin-left: 20px"> This
is a paragraph

</p>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值