HTML + CSS学习笔记

来源：互联网发布：什么是java工程师编辑：程序博客网时间：2024/05/10 08:08

1、css中padding margin 属性用法

1,margin 控制块级元素之间的距离

2,padding 控制块级元素内部 content 和 border 之间的距离。

2、ID和CLASS

ID是唯一的在CSS中优先级高于Class CLASS是共有的

<总结：单一的(id)高于共用的(class)，有指定的用指定的，无指定则继承离它最近的>

3、xhtml的块级元素(div)和内联元素(span)

块级元素：就是一个方块，像段落一样，默认占据一行出现；

[<p>、标题<h1><h2>...、列表,<ul><ol><li> 、表格<table>、表单<form>、DIV<div>和BODY<body>等]

内联元素：又叫行内元素，顾名思义，只能放在行内，就像一个单词，不会造成前后换行，起辅助作用。

[表单元素<input>、超级链接<a>、图像<img>、<span>]

Display 和 span

4、a标签的几种状态样式顺序不能颠倒

5、Css中的定位

CSS 有三种基本的定位机制：普通流、浮动和绝对定位

Positoion属性值

static

relative：元素的位置相对于它在普通流中的位置进行偏移

absolute元素框从文档流完全删除，并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭，就好像元素原来不存在一样。元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。

fixed 元素框的表现类似于将 position 设置为absolute，不过其包含块是视窗本身。

总结概述：相对定位是“相对于”元素在文档中的初始位置，而绝对定位是“相对于”最近的已定位祖先元素，如果不存在已定位的祖先元素，那么“相对于”最初的包含块。

注释：根据用户代理的不同，最初的包含块可能是画布或 HTML 元素。

添加平铺层次

z-index属性设置元素的堆叠顺序

拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。

注释：元素可拥有负的z-index 属性值。

注释：Z-index仅能在定位元素上奏效（例如position:absolute;）！