小白学习css记录
一、复习
- 什么是CSS?
层叠样式表 -层叠样式只会被覆盖而不会被替代 - CSS的使用方式
style属性---> <h1 style="css属性"></h1>
sytle标签---> head标签里面
link---><link rel="stylesheet" href="style.css"> - 基础选择器
html标签选择器 通过html标签名来选择元素
①所有的html标签都可以当做选择器
②无论标签藏多深都会被选中
③选择的是所有的标签而不是具体某个标签。所以说我们通过html标签选择器来设置的都是一些共性问题
id选择器
①任何的标签都可以用id属性和属性值(因为id是一个全局属性)。id命名不能随意的命名。大小写敏感,id的名字中可以有数字字母下划线,但是要以字母开头。
驼峰命名法 小驼峰命名法 大驼峰命名
testHeader小驼峰TestHeader大驼峰 ②但是id名不能够重复
class选择器
①任何的标签都可以使用class属性(class属性也是一个全局属性)
②class属性名可以重复使用
③一个class属性中,可以有多个class属性值。
二、综合选择器
- 后代选择器 div p
- 交集选择器 div.dl
- 并集选择器 div,p
- 子元素选择器 div>p
- 序列选择器 ul li:first-child ul:li:last-child
- 相邻兄弟选择器 div + p
- 普通兄弟选择器 div ~ p
三、继承
- 继承:父元素的某些css属性会被子元素无条件的继承过去。关于文字的css属性都可以进行继承:color text- line-font-
- 层叠
层叠解决的是css冲突的问题
比较权重来解决层叠问题
!important能够把"单独属性"的权重变为无限大。尽量少用。
四、块级元素和行内元素
div 块级元素
span 行内元素
块级元素和行内元素的区别: 1. 行内元素部不能够设置宽度和高度。行内元素的宽度和高度是标签内同的宽度和高度。块级元素可以设置宽度和高度 2. 块级元素会单独占一行。而行内元素却不能够独占一行,只能和其他行内元素共用一行。 3. 如果块级元素不设置宽度,那么块级元素会自动的占满父元素的全部宽度。
小白学习css记录的更多相关文章
- 学习CSS记录:CSS文件引入到HTML中
1.直接写在标签元素中,通常称为行间样式.(优先级较高,有悖于结构与表现的分离,建议不使用) 例:<body style="background:red;"></ ...
- 学习CSS记录:选择符优先级
1.标有!important 关键字声明属性. 2.HTML中的CSS样式属性. 3.作者编辑的CSS文件模式属性. 4.用户设置的样式. 5.浏览器默认的样式. ------------------ ...
- 小白学习python之路(一):安装python3
引言 作为一个python小白,之前学的是java,不过听说python很流行,功能很强大,可以用很少的代码实现更强的功能,因此我也是被吸引了过来,并且把我的学习经历记录下来. 当然了,要学习 ...
- 学习 CSS 样式
1.CSS浮动 : http://www.cnblogs.com/zhongxinWang/archive/2013/03/27/2984764.html (1)一个重要结论: ...
- css知多少(2)——学习css的思路
两周之前写过该系列的第一篇,其实当时只是一个想法,这段时间迟迟未更新,是在思考一个解决过程.现在初有成效,就开更吧. 1. 一个段子 开题不必太严肃,写博客也不像写书,像聊天似的写东西是最好的表达方式 ...
- Activiti 学习笔记记录(2016-8-31)
上一篇:Activiti 学习笔记记录(二) 导读:上一篇学习了bpmn 画图的常用图形标记.那如何用它们组成一个可用文件呢? 我们知道 bpmn 其实是一个xml 文件
- Activiti 学习笔记记录(二)
上一篇:Activiti 学习笔记记录 导读:对于工作流引擎的使用,我们都知道,需要一个业务事件,比如请假,它会去走一个流程(提交申请->领导审批---(批,不批)---->结束),Act ...
- PostgresSQL 学习资料记录处
PostgresSQL 学习资料记录处 博客:http://francs3.blog.163.com PostgreSQL9.4 中文手册:http://www.postgres.cn/docs/9 ...
- 开始学习css
今天开始学习css:应用一本<HTML5与CSS3网页设计基础> 先学习css样式规则声明. Body{ color:blue} 对应:选择符:{声明属性:声明值}: Background ...
随机推荐
- HEOI2019游记(退役记)
少了回程铁路相关信息,有空补 AFO 辣鸡蒟蒻ghj1222顺利地退役了 由于没带手机拍照片,本次坐动车不写运转记录,下次去CTS/APIO应该是坐普速车,应该能带手机拍照,应该会写运转记录 Day ...
- Alluxio学习
介绍 Alluxio(之前名为Tachyon)是世界上第一个以内存为中心的虚拟的分布式存储系统.它统一了数据访问的方式,为上层计算框架和底层存储系统构建了桥梁.应用只需要连接Alluxio即可访问存储 ...
- vue 数据(data)赋值问题
总结一下我遇到的一个纠结很久的问题. 在项目中需要用到后台的数据对前端渲染,使用到了vue整合的axios,使用vue中的钩子函数在页面组件挂载完成之后向后台发送一个get请求然后将返回后的数据赋值d ...
- 感想篇:7)知其然与知其所以然,KnowHow与KnowWhy
本章目的:探究--知其然与知其所以然,KnowHow与KnowWhy. 1.Know-How体系与代价: 100多年的汽车研发历史表明,企业只有开发过两代车以上才能逐步建立和完善Know-How体系. ...
- Versions maven plugin 修改版本
使用versions maven plugin插件,批量修改项目各模块的版本号,灵活推进或回退版本,避免主干每次更新代码,立即对所有分支产生影响. https://blog.csdn.net/sunz ...
- ASP.NET Core中Middleware的使用
https://www.cnblogs.com/shenba/p/6361311.html ASP.NET 5中Middleware的基本用法 在ASP.NET 5里面引入了OWIN的概念,大致意 ...
- dotnetCore增加MiddleWare的Run,Use Map MapThen四个扩展方法
dotnetCore增加MiddleWare的Run,Use Map MapThen四个扩展方法 http://www.mamicode.com/info-detail-1439628.html
- CentOS系统服务配置资源限制ulimit
使用Systemd管理服务的,均可使用此方法. 在 /usr/lib/systemd/system/xxx.service中,添加如下内容即可: [Service] # Other directive ...
- Git修改文件
如果我们修改了本地的某个文件但是没有提交,这时我们用 $ git status可以看到提示,例如我在readme2.txt里面新加了一行,然后查看状态: git status命令可以让我们时刻掌握仓库 ...
- Java .Net Byte数组存储差异以及解决方法
最近在Java与.Net服务Bytes数据交互碰到一个问题:.Net IntToBytes结果和Java IntToBytes结果是反序的,查了一下发现:Java stores things inte ...