自己在实践中遇到的一些前台基础(html、css)

前端  /  管理员 发布于 7年前   215

1.

div css鼠标变手型是 cursor:pointer;

2.

html相对位置和绝对位置布局注意： absolute 说当position属性设为absolute后，总是按照浏览器窗口来进行定位的，这其实是错误的。

当sub1的position设置为absolute后，其到底以谁为对象进行偏移呢？这里分为两种情况：

（1）当sub1的父对象(或曾祖父，只要是父级对象)parent也设置了position属性，且position的属性值为absolute或者relative时，也就是说，不是默认值的情况，此时sub1按照这个parent来进行定位。

注意，对象虽然确定好了，但有些细节需要您的注意，那就是我们到底以parent的哪个定位点来进行定位呢？如果parent设定了margin，border，padding等属性，那么这个定位点将忽略padding，将会从padding开始的地方(即只从padding的左上角开始)进行定位，这与我们会想当然的以为会以margin的左上端开始定位的想法是不同的。
接下来的问题是，sub2的位置到哪里去了呢？由于当position设置为absolute后，会导致sub1溢出正常的文档流，就像它不属于parent一样，它漂浮了起来，在DreamWeaver中把它称为“层”，其实意思是一样的。此时sub2将获得sub1的位置，它的文档流不再基于sub1，而是直接从parent开始。

（2）如果sub1不存在一个有着position属性的父对象，那么那就会以body为定位对象，按照浏览器的窗口进行定位，这个比较容易理解。

3.

css的透明度filter:alpha(opacity=0);opacity:0;-moz-opacity:0; 只有这三个css同时加上才兼容所有的浏览器

4. 窗口关系及框架

top对象始终指向最高（最外）层的框架，也就是浏览器窗口。使用它可以正确访问任何一个框架。因为对于在一个框架中编写的代码中，window对象总是指向的都是那个框架的特定实例，而非最高层的框架。比如说，在子框架中，window是指本身的对象，假使要改变本框架的src及父窗口的iframe或者是frame的src，用window是不行的，这时要用window.top.$(选择器)才能访问