《精通css》笔记
第2章 选择器,注释
1.要知道常用选择器(id选择器,类选择器,类型选择器,后代选择器,伪类选择器(文档结构之外))
通用选择器(*{ })
高级选择器(子选择器,相邻同胞选择器,属性选择器)
2.选择器特殊性分级
3.层叠和继承的区别
4.设计代码的结构,使用风格统一的大注释块分割每个部分
一般性样式 辅助样式 页面结构 页面组建 覆盖
( reset样式 (表单 ( 标题,页脚和导航 ( 各个页面)
链接 通知和错误 布局
标题 一致的条目) 其他页面结构元素)
其他元素)
5.一般企业会有自己的样式指南
第3章 盒模型,定位
1.盒模型用到的属性width,height,padding,border,margin
普通文档流的上下垂直margin会叠加
2.块级框 与 行内框, 利用display属性来改变特性,display:block,display:inlne-block
3. 3种基本的定位机制:普通流,绝对定位,浮动
4.相对定位
是普通流定位的一部分,与文档流相关,根据自身原先的位置进行移动
无论是否移动都占据原来空间position:relative
设置top,right,bottom,left的属性值进行移动
5.绝对定位
不占空间与文档流无关,
根据距离最近的已定位的祖先元素进行定位position:absolute
text-align:top / right / bottom / left
固定定位
是绝对定位的一种position:fixed
差异是包含块是视口
6.浮动float
清理(p51)
float:left
float:riagt
clear:both / left /right / none(不允许两边/不允许左边/不允许右边/允许两边)
<br class="clear"/>
《精通css》笔记的更多相关文章
- HTML+CSS笔记 CSS笔记集合
HTML+CSS笔记 表格,超链接,图片,表单 涉及内容:表格,超链接,图片,表单 HTML+CSS笔记 CSS入门 涉及内容:简介,优势,语法说明,代码注释,CSS样式位置,不同样式优先级,选择器, ...
- CSS笔记--选择器
CSS笔记--选择器 mate的使用 <meta charset="UTF-8"> <title>Document</title> <me ...
- HTML+CSS笔记 CSS中级 一些小技巧
水平居中 行内元素的水平居中 </a></li> <li><a href="#">2</a></li> &l ...
- HTML+CSS笔记 CSS中级 颜色&长度值
颜色值 在网页中的颜色设置是非常重要,有字体颜色(color).背景颜色(background-color).边框颜色(border)等,设置颜色的方法也有很多种: 1.英文命令颜色 语法: p{co ...
- HTML+CSS笔记 CSS中级 缩写入门
盒子模型代码简写 回忆盒模型时外边距(margin).内边距(padding)和边框(border)设置上下左右四个方向的边距是按照顺时针方向设置的:上右下左. 语法: margin:10px 15p ...
- HTML+CSS笔记 CSS进阶再续
CSS的布局模型 清楚了CSS 盒模型的基本概念. 盒模型类型, 我们就可以深入探讨网页布局的基本模型了.布局模型与盒模型一样都是 CSS 最基本. 最核心的概念. 但布局模型是建立在盒模型基础之上, ...
- HTML+CSS笔记 CSS进阶续集
元素分类 在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <div>.<p>.<h1&g ...
- HTML+CSS笔记 CSS进阶
文字排版 字体 我们可以使用css样式为网页中的文字设置字体.字号.颜色等样式属性. 语法: body{font-family:"宋体";} 这里注意不要设置不常用的字体,因为如果 ...
- HTML+CSS笔记 CSS入门续集
继承 CSS的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它允许样式不仅应用于某个特定html标签元素,而且应用于其后代(标签). 语法: p{color:red;} <p> ...
- HTML+CSS笔记 CSS入门
简介: </span>年的圣诞节期间,吉多·范罗苏姆为了在阿姆斯特丹打发时间,决心开发一个新的<span>脚本解释程序</span>,作为ABC语言的一种继承. & ...
随机推荐
- GPS常见故障
当出现故障时,依据可能原因进行排查. 下表列举典型故障及调试方法 现象 root cause 检查 实验 GPS无法开启/无法搜星 软件配置错误 SW 相关配置(如GPIO等) 录制mobile ...
- springboot使用thymeleaf 解析异常
在使用springboot的过程中,如果使用thymeleaf作为模板文件,则要求HTML格式必须为严格的html5格式,必须有结束标签,否则会报错!解决办法如下: 1.你可以使用严格的标签,也就是每 ...
- Python作业之购物商城
作业:购物商场 1.商品展示,价格 2.银行卡余额 3.付账 程序流程图如下: 代码如下: ShopDisplay = {'} print(ShopDisplay) ShoppingCartPrice ...
- ios 图片拉伸方法
前提:要注意图片的size和展示的图片view的size的大小. 假如图片高度50,展示图片view的高度30,拉伸会变成剪切. 如果图片尺寸不对,可以用mac自带的图片编辑器修改大小: 双击打开图 ...
- 「LuoguP3384」【模板】树链剖分
题目描述 如题,已知一棵包含N个结点的树(连通且无环),每个节点上包含一个数值,需要支持以下操作: 操作1: 格式: 1 x y z 表示将树从x到y结点最短路径上所有节点的值都加上z 操作2: 格式 ...
- 「BZOJ3438」小M的作物(最小割
3438: 小M的作物 Time Limit: 10 Sec Memory Limit: 256 MBSubmit: 1891 Solved: 801[Submit][Status][Discus ...
- Watir: Watir-WebDriver对打开的浏览器attach操作
Watir-WebDriver对于已经打开的浏览器,没有办法进行Attach操作. 但是对于自动化操作浏览器过程中点击某链接,打开的新浏览器,是能够定位到的. require 'watir-webdr ...
- flask的config配置和给实例化传入参数
灵活性主要体现在配置上,需要什么就配置什么 from flask import Flask app = Flask(__name__) # type:Flask # 调试模式:是否开启调试模式并捕获异 ...
- C#使用SendMessage发送组合键
有时需要出发菜单功能,例如发送ALT + F打开应用程序的文件菜单,如何使用SendMessage实现呢? 使用用spy++截取的ALT+F的消息内容(如何使用spy++,请熟悉的高手指点下,我使用s ...
- nc之二:nc命令详解
NetCat,在网络工具中有“瑞士军刀”美誉,其有Windows和Linux的版本.因为它短小精悍(1.84版本也不过25k,旧版本或缩减版甚至更小).功能实用,被设计为一个简单.可靠的网络工具,可通 ...