在做项目的过程中需要实现
功能:点击某元素,并在点击位置生成一个Menu
由于我是一个菜鸟,在做这个之前,对css什么的一点也不懂,于是出现两种
思路:
1.获取鼠标绝对位置,将Menu的位置设在鼠标获取的位置
2.根据相对定位,将Menu定在点击的那个元素旁边
于是学习了css相关知识,对css定位相关,进行整理
知识:
CSS有三种定位机制:普通流、浮动和绝对定位。
1.普通流
除非专门指定,否则所有的框都在普通流中定位,也就是说,普通流中元素的位置由元素(X)HTML中的位置决定。
2.绝对定位
CSS position属性实现定位功能,包括static、relative、absolute、fixed四种属性值。摘抄其解释如下:
static其中static出于普通流原始位置,relative相对于普通流原始位置进行定位,absolute和fixed为绝对定位。
3.浮动
CSS浮动看起来很复杂,实际很简单,float和clear两个属性对浮动进行控制。float:right;表示目标浮动在右边
clear:right;表示目标右边不能有其他浮动
结论:
菜鸟想象的第二种办法是行不通滴,因为无法相对于一个其他元素进行定位。
于是有了下一节,第一种解决办法。