AM：

块元素与内联元素  ：

div与span的区别 span只能设置水平的margin（左右内外边距）

在span里面加 display：block; 内联转块（相当于给span加了上下的边距）反之

/*将块元素转换成内联元素*/ 
display: inline;
/*将元素隐藏起来*/
display: none;
/*将内联元素转换成块元素*/
display: block;

PM

1.相对定位：相对与元素自己本身来移动定位
2. 绝对定位:距离父类(有position样式的父类)...要是没有找到父类，就有默认的body来代替
备注；

/*z-index:值后面不要加像素 想让哪个在前面就把哪个的值设大*/
3.fixed定位相对于浏览器窗口定位 position:fixed;

/* fixed 定位:对于浏览器窗口 */
position: fixed;
left: 20px;top: 50px;

360导航狗：

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>360导航狗</title>

    <style>

        #da{

            width:68px;

            height: 280px;

            position: fixed;

            right: 50px;

            top:280px;

            background: whitesmoke;

        }

        #a1{

            width: 74px;

            height: 82px;

            position: absolute;

            position: fixed;

            right:50px;

            top:200px;

            background-image:url(img/a1.png);

        }

        .st{

            float: right;

            position: relative;

            bottom: 30px;

            margin-right: 10px;

        }

        .zt{

            text-decoration: none;

            color: gray;

            font-size: 7px;

        }

        .zt:hover{

            color: greenyellow;

        }

        #db{

            width:50px;

            height: 280px;

            position: fixed;

            right: 60px;

            bottom:70px;

        }

        #db1{

            color: gray;

            text-decoration: none;

            font-size: 10px;

        }

        #db1:hover{

            color: greenyellow;

        }

    </style>

</head>

<body>

<div id="da">

    <div>

        <div><img src="img/a2.png" width="31px"></div>

        <div class="st"><a href="#" class="zt">娱乐</a></div>

    </div><br>

    <div>

        <div><img src="img/a3.png" width="31px"></div>

        <div class="st"><a href="#" class="zt">看片</a></div>

    </div><br>

    <div>

        <div><img src="img/a4.png" width="31px"></div>

        <div class="st"><a href="#" class="zt">购物</a></div>

    </div><br>

    <div>

        <div><img src="img/a5.png" width="31px"></div>

        <div class="st"><a href="#" class="zt">游戏</a></div>

    </div><br>

    <div>

        <div><img src="img/a6.png" width="31px"></div>

        <div class="st"><a href="#" class="zt">生活</a></div>

    </div><br>

    <div>

        <div><img src="img/a7.png" width="31px"></div>

        <div class="st"><a href="#" class="zt">借钱</a></div>

    </div>

</div>

    <div>

        <div id="db"><a href="#" id="db1">回顶部</a></div>

    </div>

<div id="a1"></div>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

</body>

</html>

163邮箱登录框

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>163邮箱登录框</title>

<style>

    #d{

        width: 340px;

        height: 45px;

        background-color:white;

        border: 1px solid #666666;}

    #d1{

        width: 38px;

        height: 45px;

        background-color: white;

        float: left;

        background-image: url( a.png);

        background-position:-242px 424px;

    }

    #d2{

        width: 202px;

        height: 44px;

        background-color:white;

        float: left;

    }

    #d3{

        width: 100px;

        height: 35px;

        background-color:white;

        float: left;

        padding-top:10px;

        }

    #d4{

        display:inline;

        font-size: 15px;

        padding:17px;

    }

    #d5{

        border: 0px;

        height: 43px;

        text-indent: 30px;

    }

    input{

        width: 202px;

        height: 39px;

        font-size: 15px;

    }

    #d6{

        width: 340px;

        height: 45px;

        background-color:white;

        border: 1px solid #666666;

    }

    #d7{

        width: 38px;

        height: 45px;

        background-color: white;

        float: left;

        background-image: url( a.png);

        background-position:-284px 424px;

    }

    #d8{

        border: 0px;

        text-indent: 30px;

        height: 43px;

        width: 250px;

    }

    </style>

</head>

<body>

<div id="d">

    <div id="d1"></div>

    <div id="d2">

        <input id="d5" type="text" name="user" placeholder="邮箱账号或手机号码">

    </div>

    <div id="d3"><span id="d4">@163.com</span></div>

</div>

<br>

<div id="d6">

    <div id="d7"></div>

        <input id="d8" type="text" placeholder="输入密码">

</div>

</body>

</html>

401 experience的更多相关文章

  1. IIS启动失败，启动Windows Process Activation Service时，出现错误13：数据无效 ;HTTP 错误 401.2 - Unauthorized 由于身份验证头无效，您无权查看此页

    因为修改过管理员账号的密码后重启服务器导致IIS无法启动,出现已下异常 1.解决:"启动Windows Process Activation Service时,出现错误13:数据无效&quo ...

  2. Pramp - mock interview experience

    Pramp - mock interview experience   February 23, 2016 Read the article today from hackerRank blog on ...

  3. git clone出现的error: The requested URL returned error: 401 Unauthorized

    error: The requested URL returned error: 401 Unauthorized while accessing https://git.oschina.net/.. ...

  4. 允许asp.net MVC报 错说明: 访问服务此请求所需的资源时出错。服务器可能未配置为访问所请求的 URL。错误消息 401.2。: 未经授权

    运行mvc3程序报以下错误 详细报错如下: “/”应用程序中的服务器错误. 访问被拒绝. 说明: 访问服务此请求所需的资源时出错.服务器可能未配置为访问所请求的 URL. 错误消息 401.2.: 未 ...

  5. 19.在HTTP 1.0中，状态码401的含义是(?);如果返回“找不到文件”的提示，则可用 header 函数，其语句为(?)写出http常见的状态码和含义,至少5个.[完善题目]

    状态401代表未被授权,header("Location:www.xxx.php"); 100-199 用于指定客户端应相应的某些动作. 200-299 用于表示请求成功. 300 ...

  6. "错误消息 401.2。: 未经授权: 服务器配置导致登录失败。"的解决办法

    [详细报错如下]: “/”应用程序中的服务器错误. 访问被拒绝. 说明: 访问服务此请求所需的资源时出错.服务器可能未配置为访问所请求的 URL. 错误消息 401.2.: 未经授权: 服务器配置导致 ...

  7. Enhanced Mitigation Experience Toolkit 软件安全性强化工具

    Enhanced Mitigation Experience Toolkit软件是微软为应对互联网中层出不穷的漏洞而推出的一款安全工具,可以在Window Update未获取到补丁前,对系统进行保护. ...

  8. 新版本eclipse Neon 4.6.1，登录git报401 没有权限

    新版本eclipse Neon 4.6.1,登录git报401 没有权限 经过查找原因竟然是新的eclipse需要进行update.比较坑,新版eclipse竟然需要先更新一下才能用! eclipse ...

  9. 401 Not Authorized For MSDEPLOY‏ (msdeployAgentService)

    When you get this error from msdeploy:“Error: The remote server returned an error: (401) Unauthorize ...

随机推荐

  1. java中的out of memory

    转:http://outofmemory.cn/c/java-outOfMemoryError java.lang.OutOfMemoryError这个错误我相信大部分开发人员都有遇到过,产生该错误的 ...

  2. Linux内核入门到放弃-时间管理-《深入Linux内核架构》笔记

    低分辨率定时器的实现 定时器激活与进程统计 IA-32将timer_interrupt注册为中断处理程序,而AMD64使用的是timer_event_interrupt.这两个函数都通过调用所谓的全局 ...

  3. left join inner join 区别

    left 以左表为准,左表在右表没有对应的记录,也为显示(右表字段填空). inner 需要满足两张表都有记录. 不管哪种join 一对多最终的结局 只会是多条记录

  4. 一些很容易被忘记的css

    一些很偏门的css,用过一两次,很难记得牢,这里,我总结一些. outline 当input选中的时候会出现一个边框 /*一般设置成 none*/ textarea:focus, input:focu ...

  5. 记自己在spring中使用redis遇到的两个坑

    本人在spring中使用redis作为缓存时,遇到两个坑,现在记录如下,算是作为自己的备忘吧,文笔不好,望大家见谅: 一.配置文件 <!-- 加载Properties文件 --> < ...

  6. Python——电子邮件、Internet协议相关模块

    一.电子邮件相关模块 email:用于处理电子邮件 smtpd:SMTP服务器 base64:Base-16.32.64数据编码 mhlib:处理MH文件格式解析的类 mailcap:mailcap文 ...

  7. 清明培训 清北学堂 DAY2

    今天是钟皓曦老师的讲授~~ 总结了一下今天的内容: 数论!!! 1.整除性 2.质数 定义: 性质:  3.整数分解定理——算数基本定理 证明: 存在性: 设N是最小不满足唯一分解定理的整数 (1)  ...

  8. 打印并输出 log/日志到文件（C++）

    #include <stdarg.h> #define MAX_LEN 1024 bool debug_mode; // 使用方法同 printf void lprintf(const c ...

  9. [JSOI2008]Blue Mary开公司[李超线段树]

    题面 bzoj luogu 好久以前听lxl讲过 咕掉了.. 竟然又遇到了 安利blog #include <cmath> #include <cstring> #includ ...

  10. shell之获取终端信息

    #!/bin/bash #tput和stty是两款终端处理工具 #获取列数和行数 tput cols tput lines #打印当前终端名 tput longname #移动光标 移动光标到100 ...