JAVA WEB day2

1、css的简介：

            *CSS 层叠样式表

                    **层叠：一层一层的

                    **样式表：    

            很多属性和属性值

        **是页面显示效果更加好

2、css的使用    与html的结合方式，（四种结合方式）

            （1）在每个Html标签上面都是一个属性 style 吧css和Html结合在  一起

                    

            （2）Html的一个标签  <style>标签 ，写在head中          * 

                    <style  type=“text/css”>

                        css代码

                        </style>

            （3）在style标签里面 使用语句

                    @import url（css文件的路径）

            -第一步，创建一个 css 文件

···            

            （4）使用头标签 link，引入外部css文件

·                -第一步，创建一个 css文件

  <link rel="stylesheet"     type="text/css"     href="css文件路径"/>

        注意i：第三种结合方式，缺点： 在某些浏览器当中是不起作用的，一般使用第四种方式

  ***优先级    由上到下  由外到内  他的优先级是由低到高的

                ***后加载的优先级高

*****格式：选择器名称（属性名： 属性值； 属性名：属性值…………）

        3、css选择器

                    **要对那个标签里面的数据进行操作

            （1）标签选择器    

                *使用标签名作为选择器的名称；

                    

            （2）class选择器

        *每个Html 标签都有一个name属性  class

            -<div class="    ">  文本</div>        

        -  .hhh{

                        background-color；organ；

                }

    （3）id选择器

            *每个html标签上面有一个属性  id

        -<div id="   ">    </div> 

        

***优先级

        

4、css的扩展选择器

        （1）关联选择器

                    *<div>< p>      文本     </p></div>

                    *设置div里面的p标签的样式，嵌套的    

                      标签之间必须有空格

        （2）组合选择器

            *<div>1111</div>

            <p>    22222</p>

        把div和p标签 设置成相同的样式，把不同的样式设置成相同的样式，

            

    （3）伪元素选择器

            *在css里面提供    了一些定义好的样式，可以拿过来使用

            *比如使用超链接     

                            ***超链接的状态 

                        原始状态：   鼠标放上去的状态            点击              点击之后       、

                           ：link            ：hover                    ：active            ：visited

            **记忆的方法：lv    ha

5、css的盒子模型

        （1） 边框：

                    

            （2）：内边距        文本内容 与 盒子边框之间的距离；

                    

          （3） 外边距

                    

6、css的布局的漂浮（了解）

        float            

  7、css的布局定位

            position        属性

                    -absolute        ：将对象从文档流中拖出，可以通过top，buttom等属性进行定位；

                    -    relative ：不会吧他从文档流中拖出去  也可使用 top  buttom等属性定位

8、图文混排；图片和文字在一起显示；

                设置div   设置两个id标签   表示文字  与图片   将图片 属性设置一个float  属性  

 9、案例  图像签名  在图片上显示文字；

                       先将文字拖出 在设置其位置，实现效果；

    

        

1.js简介：

        他是一个基于对象和事件驱动的语言，应用于客户端；

            --基于对象，            **已经提供好了对象，可以直接拿来使用，

            --事件驱动                ** html做的网站都是静态 效果， javascript 做的网页都是动态的效果，

            --客户端：专门指的就是浏览器；        

    *js的特点：    

                （1）交互性：-信息的动态交互

                （2）安全性    -js不能访问本地磁盘的文件

                （3）跨平台行        -java里面的跨平台性 是由虚拟机（jvm）实现的 ，只要能够支持js的浏览器，都能够运行。

     *javascript与java的区别：（无任何关系）

                （1）java是sun公司；现在是oracle公司  js是网景公司；

                    （2）javascript是基于对象的  java是面向对象的

                （3）java是强类型 语言，javascript是弱类型的语言

                你如：        java里面  int  i="10";

                                    js-  var   i=10;  var        m=    "10";

                (4)javascript  只需解析就可以，而java  需要先编译成字节码文件，在执行；

        *javascript 的组成：（js）

                    三部分组成；（1）ECMAScript：ECMA组织，欧洲计算机协会，  表示有ECMA组织指定的js的语法，语句。。

                                        （2）BOM    ：broswer  object    model 浏览器对象模型

                                           （3）DOM    ：document object model 文档对象模型

2、js与Html的结合方式（两种）

        （1）使用一个标签：<script type="text/javascript">            </script>

                

3、js的原始类型，和声明变量

        **java的基本数据类型，  byte  short        int        lang    float    double    char    boolean

            **定义变量 都是用一个关键字：var

            **js的原始类型（五个）    

                    

    ****typeof（）;：查看当前变量数据类型

    4、js的语句；

                **-java里面的语句；

                            if 判断语句            switch  语句            循环   for    while    do-while

                **-js里面的语句

                            if判断语句；

                                  

        switch        java 里面是从jdk1.7以后才支持 String类型的变量

                        js里面都支持        -switch（a）{  case  1:   break;            defaulet:   break;      }

                            

            **循环语句：    while 循环

                                        

                                    for循环：

                                

       5、js的运算符；

                

**字符串的相加 和 相减的操作

           

    **布尔类型

                相加减    true  是1    false  是0

        **    ==和===的区别   都是做判断；

            1.==比较的是值

            2.===比较的是值和类型

    

    6、九九乘法表练习

        

    7、js的数组

8、js的函数；在    js里面定义函数 （方法）有三种方式

            第一种方式：

            ****使用关键字 function

            ****function 方法名  （参数列表）{

                    方法体；

                    返回值可有可无，根据需求。

                    }

       

                    

        第二种方式；

                    *****匿名函数

                  var    名字   =  function（参数列表）{

                        方法体和返回值；

                    }

                    

        第三种；（用的少，了解）

                或被称为动态函数

                ***使用到js里面的内置对象Function

                    var   名字 =new Function("    参数列表"，“方法体和返回值”)

  9、js的全局变量和局部变量；

        ***全局变量，在 Script标签里面定义一个变量，这个变量再在页面中显示js部分都可以显示；

                -在方法的内部使用，在方法的外部使用，在另外一个Script标签使用

        **局部变量；在方法体内部ding'yi一个变量，只能在方法体内部使用

                    -如果在方法的外面使用，会提示出错，

                    

  10、script存放要求