css样式详解

本文详细介绍了前端开发中三种主要的CSS样式使用方法:行内样式、头部样式和外部样式。行内样式不推荐大量使用,因可能导致维护困难;头部样式适用于特定页面;外部样式是常用方式,可通过类名和ID选择元素。在React中,通过class属性设置类名,CSS文件内按类名书写样式,支持嵌套和并列书写。建议采用结构化的类名管理,提高代码可读性。
摘要由CSDN通过智能技术生成

前端书写样式的几种方式(详解)
作为一个前端人员,我们都知道样式对于页面的重要性,所以掌握样式的各种写法是至关重要的,话不多说进入正题吧!!
css样式的使用主要分为3种:

  • 行内样式在这里插入图片描述

  • 头部样式在这里插入图片描述

  • 外部样式

  1. 行内样式要尽量少用,不然会造成后期维护困难;头部样式要视情况而定,通常在只此一个页面特有的情况下用;我们要习惯使用外部样式;当然外部样式也可以通过@import来引入,但是我们不推荐。
  2. 在使用外部样式的时候,我们要配合类型或者ID名来进行选择哪个标签要进行什么样的样式设置;我们也可以在命名类名的时候就带上style,从而在css的js文件里有条理有结构的进行样式设置
    这个是react里的写法,正常的html5和css3样式还是跟以前一样,通过class="style.className"的方式进行类名设置。
    css文件中以style后的className为类名进行样式嵌套书写,父子关系的标签嵌套书写,兄弟关系的标签并列书写。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值