第三天 CSS第一天

de078120a28e460db7e5874d5b167b6d.jpg

 HTML写在body中

css写在head的style(样式)中

语法如下

(px是像素意思,调整)

4c3a9129f770468a9ea603d2b518991e.jpg

 举个例子

59afc53531074656854dbe1be15dbbc3.jpg

 p为选择器,color为样式

属性color和属性值red的组合称为键值对

中间用冒号,结尾用分号

书写规范

1.样式规范

fc4f0ec51e8d494ca4c52a540cd5a79b.jpg

2.字母规范,属性写小写

3.空格规范

b2a38b1ba9c043db93ba2d28e5ad1000.jpg

 冒号后和选择器后跟一个空格

选择器和说明的作用

1caa8a2bd8ce4162b67aaa56069906d5.jpg

8d696a688d024fc08b09c4bb2895a20a.jpg

 基础选择器

标签选择器

(进行一类一类的样式改变)

c2a6acf2a89e4537908c9b8d9bbda6ee.jpg

 应用:把男生标绿女生标粉

b8d3b4939d1840a981dc4ccb28e0a1ce.jpg

 类选择器(可以实现个别的样式改变)

分为设定和调用两个步骤

7745e454cf4e4810b72e640177983e7d.jpg

 以上为设定语法,注意以点开头的

ab232c9f10f74eb4ac6d00e27993592e.jpg

 以上为调用语法,哪行需要调用就这样写

80bab267ff154ed6a903e3f4e8200101.jpg

 样式点定位,结构类(class)调用,一个或多个,开发最常用

类选择器_多类名

7bb278e5417a44498c6a1d18f74a5a30.jpg

id选择器

与类选择器书写方法相似

6bf832ffec7047209647d2f35d4ab9f0.jpg

 不过见#开头,id定义,只能被调用使用一次

通配符选择器

不需要调用直接全选

99a5a62c753849c0b4dee5d175d14bd3.jpg

d6abd01185134212b93bf6821ae7bd26.jpg

字体

c164ab90874a443cacaca341ebb5dc81.jpg

 当有多个字体并列时,从左到右优先来,当左边的电脑显示不出就顺位到下一个

字体的大小

front-size后加px

343087e7165d4199b80ef37716e394d7.jpg

 adf48e942d7f423487d9e810aaf29745.jpg

 标题如上图h2要单独写,写body影响不了标题

字体粗细

f018eb221c344b8da44755d80a8dcc73.jpg

 提倡用数字,数字不加单位

f0e94fdfc8e9441fb910c1a93747d3b2.jpg

 文本样式

7d785caedc274e0a8108b35e49978580.jpg

 normal让倾斜的字体不倾斜

字体复合属性

279f89b56a034773a5a7db86d57968e9.jpg

 必须要保留size和family

顺序不能

文本颜色

27e6ab2b402948e28c7e5916eaaf9d0f.jpg

 对齐文本(这个div是可以变得,选目标表签)

cbb39237ccf54e42982f96a156859d82.jpg

可以链接去掉下划线

ea0aaa2adcb6487a81878fa8070518bb.jpg

 首行缩进

d73873a49d6e463a85d0890c3c6bf82f.jpg

行间距构成

71ba2cd00e5d4144b90ceaa3867294ba.jpg

 总结

6e6c71af9be04ca3b053f56761105e91.jpg

三种css引入方式

d70ea2b71dae424cbae35b3d3d23d69f.jpg

 bfdbce123c094cc4918d0b542ff784a2.jpg

 d1fed167a51a414fa43508e7d20f43f9.jpg

 dd656120cd984f44b76c0c3560128878.jpg

f04ee5d6abdb4749b5dc84bfbee25d83.jpg

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值