Web安全之CSS+Javascript+PHP

一.CSS定位

1.static静态定位
默认情况下，始终根据页面的正常流定位静态定位元素
按照代码中的顺序来安排位置。
2.relative相对定位
相对于正常位置的定位。（正常位置——静态定位的位置）
元素框偏移某个距离，元素仍保持其未定位前的形状，它原本所占的空间仍保留
3.绝对定位absolute
是相对于第一个非静态定位的父元素进行的定位，如果找不到这样的元素，则相对于HTML进行定位
元素原先在正常文档流中所占的空间会关闭，好像原来元素不存在一样
4.固定定位fixed
具有固定位置的元素相对于浏览器窗口定位
即使滚动窗口，他也不会移动

二.属性

1.框模型

A.border边框的一些属性：
1)border-style:

2)border-width:指定边框宽度。
3)border-color边框颜色。

三.CSS欺骗

1.淘宝店家将图片放到实际销量前：通过控制图片的相对位置

2.CSS历史攻击：
漏洞影响：攻击者能够获取用户浏览器的某些历史记录。

攻击原理：利用浏览器自动查询历史记录，以及CSS对访问过的和未访问过超链接样式的不同渲染。

攻击方法：由于JavaScript可以读取任何元素的CSS信息，所以能分辨浏览器应用了哪种样式从而判断用户是否访问过该链接。攻击者可以搭建自己的网站，在上面定义一些网站的超链接。当其他用户访问该网站时，浏览器会自动根据用户的历史记录判断哪些网址曾经访问过，从而以不同颜色呈现给用户。

攻击者的网站后台可以将用户访问过的网站发回给服务器，达到的效果是能够检测用户是否访问过某个网站，但并不是直接获取用户访问的历史记录。

当前网站的改进：所有浏览器引擎会故意不去区分访问过的链接还是未访问过的链接。该漏洞已被修复，如今虽然能够看到对超链接状态的不同显示，但是js已无法获取到其中的颜色差异。

<style>
:visited {
    
   color: red;  /* visited links have red */
   
</style>

<a id=