css basic

font-size:36pt; // 字体大小

margin-left:50px; // 左外边距

<p><a href="http://www.w3cschool.cn" target="_blank">This is a link</a></p>  // link declare

color:red; //  字体颜色

background-color:yellow; // 背景色

test-align:center; // 文本位置 居中、左、右

Part1

  Css组成:选择器+声明 如,

p {color:red;text-align:center;}   // 属性、值以:隔开,以 ;结束。

 查看示例 https://www.w3cschool.cn/tryrun/showhtml/ex2

Tip: css 注释方法: /* 起始   */结束

Part2

Css id 和 Css class

简单记: id#、class.

Part3

插入css到html的三种方式:

  1' 外部样式表

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

Note: css文件内的属性和值间不要留空格,如color: red;是错误的

  2' 内部样式表

<head>
<style>
hr {color:sienna;}
p {margin-left:20px;} body {background-image:url("images/back40.gif");} </style> </head>

3' 内联样式
<p style="color:sienna;margin-left:20px">这是一个段落。</p>

Note:同时具备多重样式,内联优先级高于内部样式高于外部样式。
Part4
Css text
1‘当text-align设置为"justify",每一行被展开为宽度相等,左,右外边距是对齐
2’ text-decoration 属性用来设置或删除文本的装饰
3‘ 文本缩进 如,p {text-indent:50px;}
Part4
Css link
a:link {color:#FF0000;}      /* 未访问链接*/
a:visited {color:#00FF00;}  /* visited link */
a:hover {color:#FF00FF;}  /* mouse over link */
a:active {color:#0000FF;}  /* selected link */

Part5
Css Table
1' 边框
table, th, td
{
border: 1px solid black;
}
padding属性? => 控制表格内文字与边框的距离
Part6
盒子模型?







 

 

 

 

转载于:https://www.cnblogs.com/chenqr/p/11080441.html

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值