恶补css(一)

css
一什么是样式表
css是cascading style sheet(层叠样式表)的缩写
是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。
二样式表表示法
1.<内部样式块对象>
<html>
<head>
<title>Hello CSS</title>
<style type="text/css">
<!--//用点加标签也可以,通常如此灵活
H1{color:green;font-size:36px;font-family:"Time new roman"}
P{text-indent:1cm;background:yellow;font-family:courier}
-->
</style>
</head>
<body>
<H1>&lt;H1&gt;标签的字体变成这个样子</H>
<p>&lt;p&gt;标签的效果</P>
</body>
</html>
2<外接样式表>表示法
基本格式:
<link rel=stylesheet href=url type="text/css">
<head>
<title>title of article</title>
<link rel=styelsheet href="css.css" type="text/css">
</head>
eg:css.css
.p1{    //加点加值表示不直接用于该标签  调用:class="p1"
 font-family:"宋体";
font-size:12px;
color:#ff0000;
text-decoration:none;
background-color:#000000;
}

3.<内联定义>表示法
基本格式:
<html标签 style="css样式">
css 控制显示区域
</html标签>
<p style="margin-left:0.5in;margin-right:0.5in">
这一行被增加了左右的外补丁
<p>
三执行样式表顺序
内联>外接样式表>内部样式表
基本原则:距离html语言标签就近原则
四.样式表的分类
字体设置
font-family:
font-size:
font-style:inherit/italic/normal/oblique
font-weight:bold
text-transform:uppcase,lowcase/capitaize
text-decoration:underline/overline/line-throught/blink 闪烁文字none

超级链接的颜色变化
<style type="text/css">
A:link{
   text-decoration:none;
   color:#00ff00;
   font-size:12px;
}
A:active {
  text-decoration:overline;
  font-size:13px;
  color:#ff0000;
}
A:visited{
   text-decoration:none;
   color:#000000;
}
a:hover{
 text-decoration:underline;
color:#0066FF;
}
</style>
位置设置
word-spacing
letter-spacing:字间距设置
line-height:行距设置
text-align:文字水平对齐方向
vertical-align:垂直对齐方向
text-indent:首行缩进

 

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值