、css重用

        <style>

            如果整个页面的宽度 > 900px时：

            {

                .c{

                   共有

                }

                .c1{

                    独有

                }

            }

            .c2{

                独有

            }

        </style>

        <div class='c c1'></div>

        <div class='c c2'></div>

    、自适应 和 改变大小变形

        左右滚动条的出现

        宽度，百分比

        页面最外层：像素的宽度 => 最外层设置绝对宽度

        自适应：media

    、默认img标签，有一个1px的边框

        img{

            border: ;

        }

    、作业中的数量输入框

    、块级和行内

    、form标签

            <form action='http://sssss' methed='GET' enctype='multi'>

                <div>asdfasdf</div>

                <input type='text' name='q' />

                <input type='text' name='b' />

                # 上传文件

                <input type='file' name='f' />

                <input type='submit' />

            </form>

            GET: http://sssss?q=用户输入的值

                 http://sssss?q=用户输入的值&b=用户输入的内容

            POST：

                请求头

                请求内容

    、display: block;inline;inline-block

    、float：

        <div>

            <div style='float:left;'>f</div>

            <div style='clear:both;'></div>

        </div>

    、margin:  auto;

    、padding, ---> 自身发生变化

CSS补充

    position:

        a. fiexd => 固定在页面的某个位置

        b. relative + absolute

            <div style='position:relative;'>

                <div style='position:absolute;top:0;left:0;'></div>

            </div>

    opcity: 0.5 透明度

    z-index: 层级顺序

    overflow: hidden,auto

    hover

    background-image:url('image/4.gif'); # 默认，div大，图片重复访

    background-repeat: repeat-y;

    background-position-x:

    background-position-y:

    示例：输入框

JavaScript

    独立的语言，浏览器具有js解释器

    JavaScript代码存在形式：

        - Head中

                <script>

                    //javascript代码

                    alert();

                </script>

                <script type="text/javascript">

                    //javascript代码

                    alert();

                </script>

        - 文件

            <script src='js文件路径'> </script>

        PS: JS代码需要放置在 <body>标签内部的最下方

    注释

        当行注释 //

        多行注释  /*     */

    变量：

        python：

            name = 'alex'

        JavaScript:

            name = 'alex'     # 全局变量

            var name = 'eric' # 局部变量

    写Js代码：

        - html文件中编写

        - 临时，浏览器的终端 console

    基本数据类型

        数字

            a = ;

        字符串

            a = "alex"

            a.chartAt(索引位置)

            a.substring(起始位置，结束位置)

            a.lenght    获取当前字符串长度

            ...

        列表(数组)

            a = [,,]

        字典

            a = {'k1':'v1','k2':'v2'}

        布尔类型

            小写

    for循环

        . 循环时，循环的元素是索引

            a = [,,,]

            for(var item in a){

                console.log(item);

            }

            a = {'k1':'v1','k2':'v2'}

            for(var item in a){

                console.log(item);

            }

        .

            for(var i=;i<;i=i+){

            }

            a = [,,,]

            for(var i=;i<a.length;i=i+){

            }

            不支持字典的循环

    条件语句

        if(条件){

        }else if(条件){

        }else if(条件){

        }else{

        }

        ==   值相等

        ===  值和类型都相等

        &&   and

        ||   or

    函数：

        function 函数名(a,b,c){

        }

        函数名(,,)

Dom

    、找到标签

        获取单个元素        document.getElementById('i1')

        获取多个元素（列表）document.getElementsByTagName('div')

        获取多个元素（列表）document.getElementsByClassName('c1')

        a. 直接找

            document.getElementById             根据ID获取一个标签

            document.getElementsByName          根据name属性获取标签集合

            document.getElementsByClassName     根据class属性获取标签集合

            document.getElementsByTagName       根据标签名获取标签集合

        b. 间接

            tag = document.getElementById('i1')

            parentElement           // 父节点标签元素

            children                // 所有子标签

            firstElementChild       // 第一个子标签元素

            lastElementChild        // 最后一个子标签元素

            nextElementtSibling     // 下一个兄弟标签元素

            previousElementSibling  // 上一个兄弟标签元素

    、操作标签

        a. innerText

            获取标签中的文本内容

            标签.innerText

            对标签内部文本进行重新复制

            标签.innerText = ""

        b. className

            tag.className =》 直接整体做操作

            tag.classList.add('样式名')   添加指定样式

            tag.classList.remove('样式名')   删除指定样式

            PS：

                <div onclick='func();'>点我</div>

                <script>

                    function func(){

                    }

                </script>

        c. checkbox

                获取值

                checkbox对象.checked

                设置值

                checkbox对象.checked = true

html 笔记2的更多相关文章

  1. git-简单流程（学习笔记）

    这是阅读廖雪峰的官方网站的笔记,用于自己以后回看 1.进入项目文件夹 初始化一个Git仓库,使用git init命令. 添加文件到Git仓库,分两步: 第一步,使用命令git add <file ...

  2. js学习笔记：webpack基础入门（一）

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

  3. SQL Server技术内幕笔记合集

    SQL Server技术内幕笔记合集 发这一篇文章主要是方便大家找到我的笔记入口,方便大家o(∩_∩)o Microsoft SQL Server 6.5 技术内幕 笔记http://www.cnbl ...

  4. PHP-自定义模板-学习笔记

    1.  开始 这几天,看了李炎恢老师的<PHP第二季度视频>中的“章节7:创建TPL自定义模板”,做一个学习笔记,通过绘制架构图.UML类图和思维导图,来对加深理解. 2.  整体架构图 ...

  5. PHP-会员登录与注册例子解析-学习笔记

    1.开始 最近开始学习李炎恢老师的<PHP第二季度视频>中的“章节5:使用OOP注册会员”,做一个学习笔记,通过绘制基本页面流程和UML类图,来对加深理解. 2.基本页面流程 3.通过UM ...

  6. NET Core-学习笔记（三）

    这里将要和大家分享的是学习总结第三篇:首先感慨一下这周跟随netcore官网学习是遇到的一些问题: a.官网的英文版教程使用的部分nuget包和我当时安装的最新包版本不一致,所以没法按照教材上给出的列 ...

  7. springMVC学习笔记--知识点总结1

    以下是学习springmvc框架时的笔记整理: 结果跳转方式 1.设置ModelAndView,根据view的名称,和视图渲染器跳转到指定的页面. 比如jsp的视图渲染器是如下配置的: <!-- ...

  8. 读书笔记汇总 - SQL必知必会（第4版）

    本系列记录并分享学习SQL的过程,主要内容为SQL的基础概念及练习过程. 书目信息 中文名:<SQL必知必会(第4版)> 英文名:<Sams Teach Yourself SQL i ...

  9. 2014年暑假c#学习笔记目录

    2014年暑假c#学习笔记 一.C#编程基础 1. c#编程基础之枚举 2. c#编程基础之函数可变参数 3. c#编程基础之字符串基础 4. c#编程基础之字符串函数 5.c#编程基础之ref.ou ...

  10. JAVA GUI编程学习笔记目录

    2014年暑假JAVA GUI编程学习笔记目录 1.JAVA之GUI编程概述 2.JAVA之GUI编程布局 3.JAVA之GUI编程Frame窗口 4.JAVA之GUI编程事件监听机制 5.JAVA之 ...

随机推荐

  1. vue之computed和watch

    计算属性 computed 侦听器or观察者 watch 一直以来对computed和watch一知半解,用的时候就迷迷糊糊的,今天仔细看了看文档,突然茅塞顿开,原来就是这么简单啊: computed ...

  2. svn文件管理器的使用

    服务器端: 客户端 使用SVN的注意事项 做任何操作之前,先update一下 不要修改其他人的文件 不要在SVN里直接打开.编辑文件 不要在打开.编辑文件的时候,进行操作 SVN客户端的安装,非常简单 ...

  3. 2016 10 27 考试 dp 向量 乱搞

    目录 20161027考试 T1: T2: T3: 20161027考试 考试时间 7:50 AM to 11:15 AM 题目 考试包 据说这是一套比较正常的考卷,,,嗯,,或许吧, 而且,,整个小 ...

  4. securefx连接linux后文件夹中文乱码问题解决

    首先在选项中设置字符编码为UTF-8 然后在全局选项中找到Securefx的配置文件 进入到该目录中,选择“Sessions”: 在“Sessions”中找到链接地址的ini文件,并用文本编辑器打开: ...

  5. 在android中，编译的项目使用到第三方jar的导入方法 终极版！

    1,在android系统环境中编译自己的项目时,往往会用到第三方jar包.这些jar包在eclipse中加入编译,一路畅通,由于eclipse已经帮助你配置好了.可是当把这个项目复制到系统环境中编译时 ...

  6. deque迭代器失效的困惑？

    在实现LRU算法的时候lru_list 開始用的是deque 可是由于害怕其在插入删除上的迭代器失效情况的诡异情况.遂用list取代之. 在数据量比較大的时候性能不是非常好.性能优化分析的时候决定用d ...

  7. BootStrap有用代码片段（持续总结）

    > 如题.持续总结自己在使用BootStrap中遇到的问题.并记录解决方法.希望能帮到须要的小伙伴 1.bootstrap上下布局.顶部固定下部填充 应用场景:经典上下布局中,顶部导航条固定,下 ...

  8. Java多线程理解：线程安全的集合对象

    1.概念介绍 线程安全就是多线程访问时,采用了加锁机制,当一个线程访问该类的某个数据时,进行保护,其他线程不能进行访问直到该线程读取完,其他线程才可使用.不会出现数据不一致或者数据污染. 线程不安全就 ...

  9. 洛谷P1137 旅行计划 解题报告(拓扑排序+DP)

    我看了一下其他大佬的题解,大部分都是拓扑排序加上DP.那么我想有的人是不明白为什么这么做的,拓扑排序有什么性质使得可以DP呢?下面我就提一下. 对一个有向无环图(Directed Acyclic Gr ...

  10. TurtleWorld Exercises

    1. Write a function called square that takes a parameter named t, which is a turtle. It should use t ...