分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 技术分享

html之css选择器语法学习笔记

发布时间:2023-09-06 01:44责任编辑:郭大石关键词:选择器

??

相关内容:

css选择器的用法:

  • 选择器的语法
  • 标签选择器
  • 类选择器
  • id选择器
  • 选择器的分组
  • 嵌套选择
  • 属性选择器
  • 子标签选择器
  • 相邻兄弟选择器

参考资料:w3school

首发时间:2018-03-02 23:54


css选择器的用法:

  • css选择器的语法:css选择器的定义有两部分组成,一个是选择器,一个是样式定义  
  • 标签选择器(直接根据标签来选择):
    • h1 {color:red; font-size:14px;}p { color: #ff0000; }body { ?color: #000; ?background: #fff; ?margin: 0; ?padding: 0; ?font-family: Georgia, Palatino, serif; ?}
  • 类选择器:
    • 在 CSS 中,类选择器以一个点号代表
    • 可以在标签选择的基础上根据它们的类而选择:
    • 把两个类选择器链接在一起,仅可以选择同时包含这些类名的元素,比如.important.warning {background:silver;} 只会选择class="important warning"的标签

 

 

  • id选择器【根据标签的id来筛选出指定的标签来添加特定的样式】:
    • id 选择器以 "#" 来定义。
    • 可以在选择标签的基础上根据它们的id而选择:
  • 选择器的分组 【同时给多种标签加样式,使用逗号分隔各个选择器】
    h1,h2,h3,h4,h5,h6 {color: green;}
  • 派生选择器\后代选择器【根据文档上下文关系来筛选】:
  • 属性选择器:
  • 子标签选择器:
    • 子标签选择器只能选择作为某标签子标签的元素
  • 相邻兄弟选择器:
    • 如果需要选择紧接在另一个标签后的标签,而且二者有相同的父标签,可以使用相邻兄弟选择器

由于本人并不是专业学前端的,学也只是为了方便其他开发,所以只会抓住重点

如果想要了解更多css语法,可以参考w3school


html之css选择器语法学习笔记

原文地址:https://www.cnblogs.com/progor/p/8495520.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved