首页前端开发CSSCSS id与CSS class

CSS id与CSS class

时间2024-05-20 06:20:03发布访客分类CSS浏览15
导读:CSS ID与CSS CLASS 前面我们介绍过了id与class区别,接下来再简单介绍CSS id与CSS class区别与用法。 id与class对应图 CSS id知识: 在一个网页里ID只能使用一次。当然即使一个id在一个网页内被...

CSS IDCSS CLASS

前面我们介绍过了id与class区别,接下来再简单介绍CSS id与CSS class区别与用法。


id与class对应图

CSS id知识:
在一个网页里ID只能使用一次。当然即使一个id在一个网页内被使用多次,其CSS样式仍然可以实现生效,但是一般规定W3C标准是使用一次。因为ID在html里可以赋予html标签特殊的属性如一下JS动作、表单传值等特性所以区别于一个class可以使用多少的次,而一个CSS 命名的id只能使用一次避免一些特定动作、传的表单值的兼容性特性错误即使没有其它JS脚本动作、表单传值特性但是我们也一定执行一个页面只能使用一次。

id 选择器以 "#" 来定义,命名CSS选择器。
定义命名css id选择器例子:
#yangshi1{ color:#F00; } 定义红色www.divcss5.com实例
#yangshi2{ color:#0F0; } 定义绿色

对应html中div引用

我颜色为红色

我颜色为绿色

一个div标签的定义只能使用一个id如:

www.divcss5测试内容


www.divcss5测试内容

两个都是不正确的,并且CSS样式属性也不能生效- 成为CSS 失效之一。

CSS class知识:
与CSS ID不同特性是clsss类可以在一个网页内无限次引用。

Class 选择器定义以"."来定义。定义css class选择器例子:.yangshi1{ color:#F00; } 定义文字为红色.yangshi2{ font-size:28px; } 定义文字大小为18px

对应html中div+css引用:

  1. 我颜色为红色
  2. www.divcss5.com我字体大小为28px
  3. 我颜色为红色文字大小为28px

以上即是"yangshi1""yangshi2"类的正确使用方法

扩展知识:能否使用数字命名CSS 属性选择器css 命名规范-CSS命名大全集合

以下为错误的css类使用方法:

我将无效

这样的引用方法即是错误的引用方法,同样可以得出一个div标签内只能出现一个"class=",如果出现多个css类要应用到一个div标签内,即可以使用
来表达。
一个div标签内运用id和class是可以的:
.yangshi1{ ... ...}
#yangshi2{ ... ...}
.yangshi3{ ... ...}
这样是可以的也是正确的.
同样是正确的可取的。

总结:
本文分别从知识点到实例讲解了div css中id和class的运用、需要注意地方、正确运用引用方法。通过divcss5中css实例方式正确与错误运用css id和css class让大家能掌握css 基础知识点。

扩展知识:如何选择class与id

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!


若转载请注明出处: CSS id与CSS class
本文地址: https://pptw.com/jishu/663963.html
CSS 加粗(css font-weight) css 字体颜色(css color)

游客 回复需填写必要信息