1.http协议

 一：HTTP协议：hypertext transport protocol(超文本传输协议)

     特点：

         1.请求与响应

         2.无状态的协议

     请求协议：

         请求首行：

         请求头信息：

                 Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8

                 Accept-Encoding:gzip, deflate, br

                 Accept-Language:zh-CN,zh;q=0.9

                 Connection:keep-alive

                 Cookie:BAIDUID=47A6DD50BC3D91236FEE1906BD2DE0B6:FG=1; BIDUPSID=47A6DD50BC3D91236FEE1906BD2DE0B6; PSTM=1510046493; ispeed_lsm=10; BD_UPN=12314753; BDORZ=B490B5EBF6F3CD402E515D22BCDA1598

                 Host:www.baidu.com

                 Upgrade-Insecure-Requests:1

                 User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.89 Safari/537.36

         空行：

         请求体：

         --如果是get方式提交，数据是存放在UTL后面；而post是放在请求体中。

     响应：

         Bdpagetype:1

         Bdqid:0x8f6422cd00053969

         Bduserid:0

         Cache-Control:private

         Connection:Keep-Alive

         Content-Encoding:gzip

         Content-Type:text/html; charset=utf-8

         Cxy_all:baidu+10365439d71d1527700dadaf75cc64b2

         Date:Wed, 08 Nov 2017 10:05:53 GMT

         Expires:Wed, 08 Nov 2017 10:05:32 GMT

         Server:BWS/1.1

         Set-Cookie:BDSVRTM=0; path=/

         Set-Cookie:BD_HOME=0; path=/

         Set-Cookie:H_PS_PSSID=1424_24866_24558_21107_24879_22159; path=/; domain=.baidu.com

         Strict-Transport-Security:max-age=172800

         Transfer-Encoding:chunked

         Vary:Accept-Encoding

         X-Powered-By:HPHP

         X-Ua-Compatible:IE=Edge,chrome=1

2.css选择器（标签名，id,类，属性，伪类）

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>css</title>

     <style>

         #div2{

             color:red;

             background:gray

         }

         #div1{

             color:green;

             background:blue

         }

     </style>

     <!--注意这里必须加上rel='stylesheet'，外部文件才能生效，告诉浏览器是层叠样式表-->

     <!--在css选择器中有一个加载顺序，简单说就是就近原则。作用域越小，优先级越高-->

     <link type="text/css" rel="stylesheet" href="mycss.css" />

 </head>

 <body>

     <div id="div2">hello world</div>

     <div id="div1">nihao</div>

     <div id="div3">hellllll</div>

 </body>

 </html>
 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>css选择器</title>

 <!--四种选择器：

     1.通用选择器

     2.标签名选择器

     3.id选择器（唯一值）

     4.class类选择器(可以有多个，这多个成为一类)

     5.基本组合选择器比如：#outer .c1{}---后代选择器

                       #outer,.c1{}---并列选择器

                       #outer>.c1>.c2{}---子代选择器

                       #outer+.c1{}----相邻标签选择器（必须是紧挨着才有用）

     6.属性选择器：

 -->

     <style>

         *{

             font-size:45px;

         }

         p{

             background-color:yellow;

         }

         div{

             color:green;

         }

         #p1{

             color:red;

         }

         .c1{

             color:gray;

             background-color:#8ABCD8

         }

     </style>

 </head>

 <body>

     <p >hello</p>

     <div >hello div hello span</div>

     <p id="p1">你好</p>

     <div class="c1">我子啊</div>

     <div class="c1" >你们</div>

 </body>

 </html>
 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>伪类选择器</title>

     <style >

         a:link{

             color:red;

         }

         a:hover{

             color:yellow;

         }

         a:visited{

             color:purple;

         }

         a:active{

             color:green;

         }

     </style>

 </head>

 <body>

     <a href="https://www.baidu.com">百度</a>

 </body>

 </html>

3.外边框和内边距

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>内外边距</title>

     <style>

         body{

             border:dashed 5px red;

         }

         .div1{

             border:dashed 2px black;

             height:200px;

             width:30%;

             background-color:purple;

             margin:10px;

             padding:10px;

         }

         .div2{

             border:dashed 2px black;

             height:200px;

             width:20%;

             background-color:green;

             margin:20px;

             padding:20px

         }

         .div3{

             border:dashed 2px black;

             height:300px;

             width:20%;

             background-color:blue;

             margin:30px;

             padding:30px

         }

     </style>

 </head>

 <body>

 <!--在css中一切都是盒子模型-->

 <div class="div1">div1</div>

 <div class="div2">div2</div>

 <div class="div3">div3</div>

 </body>

 </html>
 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>练习</title>

     <style>

         body{

             margin:0px;

             border:solid 2px

         }

         .div1{

             height:300px;

             width:300px;

             background-color:green;

             border:1px solid black;

             padding:20px;

         }

         .div2{

             height:100px;

             width:100px;

             background-color:red;

             margin:100px

         }

     </style>

 </head>

 <body>

 <!--练习：300px*300px的盒子装着100px*100px的盒子，通过margin和padding设置小盒子移动到大盒子的中间-->

     <div class="div1">11

             <div class="div2">

             </div>

     </div>

 </body>

 </html>

css一些简单的例子的更多相关文章

  1. CSS雪碧，即CSS Sprite 简单的例子

    CSS Sprite生成工具 http://pan.baidu.com/s/1gdGQwiJ 工具可将多幅图片整合一张,并生成CSS. HTML代码 <style> .img{backgr ...

  2. php+jquery+ajax+json简单小例子

    直接贴代码: <html> <title>php+jquery+ajax+json简单小例子</title> <?php header("Conte ...

  3. Html5 和 CSS的简单应用

    本文是利用几个简单的小例子,来实现html+css的简单应用. 菱形链接菜单 本例是采用html5+css3.0设置的菜单链接.其中主要用到了以下几个方面: CSS3.0中的2D变换,如:旋转tran ...

  4. 跨站脚本功攻击，xss，一个简单的例子让你知道什么是xss攻击

    跨站脚本功攻击,xss,一个简单的例子让你知道什么是xss攻击 一.总结 一句话总结:比如用户留言功能,用户留言中写的是网页可执行代码,例如js代码,然后这段代码在可看到这段留言的不同一户的显示上就会 ...

  5. 简单的例子了解自定义ViewGroup(一)

    在Android中,控件可以分为ViewGroup控件与View控件.自定义View控件,我之前的文章已经说过.这次我们主要说一下自定义ViewGroup控件.ViewGroup是作为父控件可以包含多 ...

  6. CSharpGL(1)从最简单的例子开始使用CSharpGL

    CSharpGL(1)从最简单的例子开始使用CSharpGL 2016-08-13 由于CSharpGL一直在更新,现在这个教程已经不适用最新的代码了.CSharpGL源码中包含10多个独立的Demo ...

  7. 用一个简单的例子来理解python高阶函数

    ============================ 用一个简单的例子来理解python高阶函数 ============================ 最近在用mailx发送邮件, 写法大致如 ...

  8. Spring-Context之一:一个简单的例子

    很久之前就想系统的学习和掌握Spring框架,但是拖了很久都没有行动.现在趁着在外出差杂事不多,就花时间来由浅入深的研究下Spring框架.Spring框架这几年来已经发展成为一个巨无霸产品.从最初的 ...

  9. C#调用存储过程简单完整例子

    CREATE PROC P_TEST@Name VARCHAR(20),@Rowcount INT OUTPUTASBEGIN SELECT * FROM T_Customer WHERE NAME= ...

随机推荐

  1. spring-boot学习资料

    spring-boot: http://www.ityouknow.com/spring-boot 这里的内容都可以学习下: https://zhuanlan.zhihu.com/dreawer?to ...

  2. LINUX 笔记-crontab命令

    用户所建立的crontab文件中,每一行都代表一项任务,每行的每个字段代表一项设置,它的格式共分为六个字段,前五段是时间设定段,第六段是要执行的命令段,格式如下: minute   hour   da ...

  3. 深入理解Java虚拟机--上

    深入理解Java虚拟机--上 第2章 Java内存区域和内存溢出异常 2.2 运行时数据区域 图 2-1 Java虚拟机运行时数据区 2.2.1 程序计数器 程序计数器可以看作是当前线程所执行的字节码 ...

  4. LeetCode 167. Two Sum II - Input array is sorted （两数之和之二 - 输入的是有序数组）

    Given an array of integers that is already sorted in ascending order, find two numbers such that the ...

  5. 写了一个bug，最后却变成了feature，要不要修呢？

    事情是这样子的,前不久接到一个需求,为一个游戏开发礼包码功能 通常一款游戏运营期间会搞各种各样的活动吸引玩家,其中最常见的就是发放礼包,  玩家可以通过礼包码兑换礼包. 用礼包码兑换礼包有个一限制,游 ...

  6. Building roads

    Building roads Time Limit: 10000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Tot ...

  7. hdu 3091 Necklace(状态压缩类似于TSP问题)

    Necklace Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 327680/327680 K (Java/Others)Total ...

  8. 分酒问题（DFS解法）

    题目大概是这样: 已知有三个容量分别为3千克.5千克和8千克的并且是没有刻度的酒瓶,3千克和5千克的瓶子均装满了酒,而8千克的瓶子为空.现要求仅用这三个酒瓶将这些酒均分为两个4千克并分别装入5千克和8 ...

  9. 一个“”字引发的痛苦经历

    (一篇老文章,还有点价值,特意整理了一下.由于涉及客户项目,已经进行了脱敏处理) 1 写在前面的话 虽然这个问题是有解决方案的,但我不建议大家提供给客户,理由见此. 2 问题描述 2010.10.12 ...

  10. SQL Server Backup & Restore

    USE [master]; GO CREATE DATABASE test; GO CREATE DATABASE test2; GO BACKUP DATABASE test TO DISK = ' ...