css入门知识点整理

时间:2022-09-23 16:47:46

css入门知识点整理

不要嘲笑我这个蒟蒻。。例子来源:w3school

css其实就分为两个东西,一个是选择器,另外一个是声明。声明定义了某个对象的属性的值,这都是html的内容。重点要关注的是选择器。顾名思义,选择器就是用来“选择”HTML中的元素的。通过定义选择器可以选出HTML文档中的某些元素,然后把它们的样式变成声明中的。css的格式长这样:

selector {declaration1; declaration2; ... declarationN }

这里有一个最基本的css例子:

h1 {color:red; font-size:14px;}

意思就是说,把所有是h1的元素,颜色都变成红色,字体大小设置成14像素。

选择器有很多用法:

  • 后代选择器 x y{ ... } 。它的作用是,只有在x元素中的y元素才会被选择。前面讲的相当于中x设成所有元素。

  • 子元素选择器 x>y{ ... }。它的作用和后代选择器差不多,但是只能选择下一层的后代。

  • 兄弟选择器 x+y{ ... }。它的作用是,只有和x是兄弟的元素y才会被选择。

    前三个选择器统称派生选择器。它们还能和后面的选择器组合起来。

  • id选择器 #idName{ ... }。它能选择所有id=idName的元素。注意,id不建议共用。

  • class选择器 .className{ ... }。它能选择所有class=className的元素。

  • title选择器 [title=X]{ ... }。它能选择所有title=X的元素。等号替换成~=/|=,意思是可以匹配X中的任何一个子串(用空格分隔/用-分割)。

就是这样~

css入门知识点整理的更多相关文章

  1. HTML&&CSS基础知识点整理

    HTML&&CSS基础知识点整理 一.WEB标准:一系列标准的集合 1. 结构(Structure):html 语言:XHTML[可扩展超文本标识语言]和XML[可扩展标记语言] 2. ...

  2. javascript基础入门知识点整理

    学习目标: - 掌握编程的基本思维 - 掌握编程的基本语法 typora-copy-images-to: media JavaScript基础 HTML和CSS 京东 课前娱乐 众人皆笑我疯癫,我笑尔 ...

  3. vue前端面试题知识点整理

    vue前端面试题知识点整理 1. 说一下Vue的双向绑定数据的原理 vue 实现数据双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty() 来劫 ...

  4. 【Python全栈-CSS】CSS入门

    CSS入门教程 参考: http://www.cnblogs.com/yuanchenqi/articles/5977825.html http://www.ruanyifeng.com/blog/2 ...

  5. css布局知识点汇总

    昨天早上看到了一篇很棒的文章,这篇文章将布局的一些知识点整理的很不错.我也想整理一下,这样在以后的项目中可以活学活用,避免只用一种方式. 参考文章:https://segmentfault.com/a ...

  6. html与css入门经典视频教程 千锋说要这样学

    PHP初学者看过来,老师带来的PHP入门经典视频教程,带你轻松入门,学习PHP就是这么简单. 很多人不理解为什么学习PHP要先学习HTML基础和CSS,其实PHP作为服务器的脚本语言,在开发过程中用于 ...

  7. 【Android 面试基础知识点整理】

    针对Android面试中常见的一些知识点整理,Max 仅仅是个搬运工.感谢本文中引用文章的各位作者,给大家分享了这么多优秀文章.对于当中的解析,是原作者个人见解,有错误和不准确的地方,也请大家积极指正 ...

  8. web前端面试知识点整理

    一.HTML5新特性 本地存储 webStorage websocket webworkers新增地理位置等API对css3的支持canvas多媒体标签新增表单元素类型结构标签:header nav ...

  9. 微信小程序入门知识点总结

    微信小程序入门知识点总结 前情介绍 ​ 微信小程序就不多介绍了,我们想要开发微信小程序首先得到微信公众平台 下方的小程序处注册相关账号并登录,接着填写小程序相关资料.在设置处可找到AppID用以开发微 ...

随机推荐

  1. Java标识符和关键字

    一.标识符      概念:就是用于给程序中的变量.类.方法命名的符号;      标识符规则:标识符可以有字母.数字.下划线_.和美元符号$组成,并且数字不能打头                   ...

  2. Linux常用命令(转)

    源自:http://www.linuxidc.com/Linux/2011-08/40437.htm Linux管理文件和目录的命令 命令 功能 命令 功能 pwd 显示当前目录 ls 查看目录下的内 ...

  3. RabbitMQ集群环境搭建-4

    确保成功安装好JDK,erlang,RabbitMQ等,并且RabbitMQ能正常启动,多台电脑之间能互相ping得通. 1. 安装 erlang.rabbitmq 如: 192.168.1.1.19 ...

  4. 百度地图API使用记录

    用户数据图层的总教程: 就是把用户数据存到LBS云里面,应用从云里面读数据 http://developer.baidu.com/map/jsdevelop-9.htm 上传数据的地方: http:/ ...

  5. Nutch的配置以及动态网站的抓取

    http://blog.csdn.net/jimanyu/article/details/5619949 一:配置Nutch: 1.解压缩的nutch后,以抓取http://www.163.com/为 ...

  6. 009-Selenium2环境搭建

    1.Java开发环境的搭建      本课程中将使用Java语言编写Selenium自动化测试脚本,在Eclipse集成开发环境中运行. (1)jdk的安装 a.下载 官网下载,http://www. ...

  7. hive支持sql大全

    转自:http://www.aboutyun.com/thread-7316-1-1.html 一.关系运算:1. 等值比较: = 语法:A=B 操作类型:所有基本类型 描述: 如果表达式A与表达式B ...

  8. 自定义view实现阻尼效果的加载动画

    效果: > 需要知识: 1. 二次贝塞尔曲线 2. 动画知识 3. 基础自定义view知识 先来解释下什么叫阻尼运动 阻尼振动是指,由于振动系统受到摩擦和介质阻力或其他能耗而使振幅随时间逐渐衰减 ...

  9. BOM和DOM的区别

    一.BOM和DOM之间的关系图 window对象是BOM的顶层(核心)对象,所有对象都是通过它延伸出来的,也可以称为window的子对象由于window是顶层对象,因此调用它的子对象时可以不显示的指明 ...

  10. Word Count

    Word Count 一.个人Gitee地址:https://gitee.com/godcoder979/(该项目完整代码在这里) 二.项目简介: 该项目是一个统计文件字符.单词.行数等数目的应用程序 ...