学习笔记2-走进css | 豆包MarsCode AI刷题

135 阅读3分钟

一、CSS是什么?

  css:cascading style sheets  ,用来定义页面元素的样式:

  • 设置字体和颜色·
  • 设置位置和大小
  • ·添加动画效果

image.png

二、CSS语法使用

1.css 的使用方式

  •   每个样式属性之间用分号连接,例:
  •   color:red; 字体颜色
  •   background-color:yellow; 背景颜色
  •   font-size: 50px; 字号大小

行内样式,内联样式

  •   在元素中,写style属性,在style属性中编写样式
  •   <元素 style="样式声明;样式声明....."></元素>

只对当前元素生效,代码没有可重用性,内联样式默认优先级最高,内联样式只在学习和测试中使用,项目很少用。

②内部样式

在head标签中,编写style标签,在style标签内部,编写属性

选择器{样式声明;样式声明…}

选择器:定义页面中使用这个样式的元素条件

使用:只能在当前页面中使用,项目中使用较少,

     学习和测试使用较多

③外部样式

创建一个.css文件,在html中的head标签里,使用link引入,必须有rel=“stylesheet”,代表当前文件和引入文件的关系。

2 、.css的使用方式

①继承性

  •   文本样式和字体样式的继承
  •   绝大多数文本字体样式,可以被继承
  •   a标签不会继承字体颜色

②堆叠性

  为一个标签定义多个样式规则

  如果样式属性不冲突,都会作用到这个标签上

③优先级

  •   默认优先级
  •   高 内联样式
  •   中 内部样式,外部样式-------就近原则
  •   低 浏览器默认样式
  •   f12关于优先级的显示
  •   默认情况下,f12中样式是按照默认优先级顺序从上往下显示

④调整优先级

  1. 设置最高优先级 !important,比内联都高
  2. 写在某一个值与分号之间,!important与值之间有空格
  3. color: red !important ;

注意,内联样式不允许设置!important,语义要求

个人学习心得/建议:

1,学会取舍

全部前端内容太多了,学到一定阶段,不断学习过程中,知识总会给你开一个更大更广的知识群,要冷静取舍,从而向更加明确自己感兴趣擅长的方向前进或拓宽。

 

2,学会自己找答案与提问

自己专研,毕竟有时候没人愿意告诉你答案;同时,有时也要有不耻下问的谦逊,实在找不到解决方法就要问。一个合格的程序员要学会面对百度编程

 

3,定期反思总结

不要一味地逼自己学,还是要了解自己到底什么方法适合自己,定期花一些时间冥想反思有助于提升学习效率。还有,人的忘性极大,不及时巩固一些知识点就跟白学一样,所以定期回顾知识,尽量总结知识架构。

费曼学习法:Concept (概念)、Teach (教给别人)、Review (回顾)、Simplify (简化)

 

4,写博客,看博客

将最近学的知识点总结分享在网络平台上,就当做教陌生人,不一定要多好,毕竟互相不认识,自娱自乐,当笔记也好。这样可以提高你学习兴趣,但也不要弄错重点,实操>理论