从0开始的web测试（一）

web测试需要了解什么（一）

1、三大标准

   html 结构标准
   css  样式标准
   js   行为标准

2、网页简介

   head中写的是头文字，包含标题以及样式等
   body为网页的主体，看到的东西基本都在网页里

3、基础的代码行

    回车 br /
    空格 &nbsp（一个汉字字符）
    段落标签 <p>  <p/>
    标题 h1,h2,h3,h4,h5,h6 （双标签）
    弱语句 文字格式：加粗 b 删除线 s 倾斜 i
    强语句 文字格式：加粗 Strong 删除线 del 倾斜 em
    span 小盒子 放在标签内的东西会在同一行显示
    div  大盒子 放在标签内的东西会在不同行显示
    插入图片 <img src="图片名" width=“宽度” height=“高度” alt=“图片不加载情况下提示文字” title=“鼠标悬停后的提示文字”/>
    键值对 属性名=“属性值”
    超链接 <a href="网站地址">当前页面打开
    <a href="网站地址" target =“_blank”>新页面打开
    <a href="#" >空链接

4、表单

   <form action=“地址，后台地址”method="post加密传输，get 普通传输">
    <input type="submit",value="备注"/>
    <input type="test",value="输入框"/>
    <input type="password",value="输入框"/>
    <input type="radio",value="单选框"/>
    <input type="checkbox",value="单选框" name="xingbie"(name值相同相当于分组) checked="checked"(默认选中)/>
    <label for="xiangbie">nv<label>（点击标签文字可以选中）
    ctrl / 注释
    <select name="">
       <option value="" selected="selected">下拉菜单的内容</option>
    </select>(下拉菜单)
    <textarea name="" id="" cols="宽" rows="高" > style textarea resize none；文本域无法被放大
    <input type="button",value=""/>普通按钮
    <input type="reset",value="按钮上的文字"/>重置按钮

5、css基本语句（级联样式表，层叠样式表）

     1、css书写在title标题下
     2、<style type="text/css">
        div{在此处设置div属性weight（设置高度）heighet（设置宽度）background（设置背景）}
        </style>
        <div></div>
     3、多个div采用id选择，id只允许有一个
       #+id名字  优先级最高
       <div id="名字"></div>
       采用类选择
       .+类名字,类可以有多个
       <div class="类名"></div>
     4、标签选择器有继承性，当子类无样式，直接继承父类的，如果子类有样式，则启用子类的样式，继承的样式在优先级中，占比最小。
     5、标签选择器具有覆盖性，从上往下执行语句，下方的语句会覆盖上方的样式
     6、权重对比，权重具有累加性
          #id选择器>.class选择器>标签选择器>继承样式
     7、外链css 采用<link=>
     8、后代选择器，大的标签后+空格+后代名字,表示选择后代
          div span{}
     9、并列选择器，多个选择器后加，表示共同选中
         h1,h2,div1,span{}
     10、权重对比， 内嵌等于外连小于行内
           语句中+!important  语句权重升到最高； 
     11、border边框 soild 实线 dashed 虚线 dotted点点 double双线 padding 内边距
     margin 外边距
     12、audio 音频 autoplay 自动播放 controls 控制菜单
         video 视频         

6.js

    1、写在html 最后
         <scricpt text="text/javascricpt">alert("弹窗内容")；</scricpt>
    2、document.getElementById(‘id的名字’).onclick(在点击的时候)=function(){
    内部写方法}
    3、document.getElementsByClass(‘class的名字’)[0(选中第几个class)].onclick(在点击的时候)=function(){
    内部写方法}
    4、外链<scricpt text="text/javascricpt" src="外链js文件">
    ~~ 内部不执行alert("弹窗内容")；~~
    </scricpt>     
    5、js常见特效
        导航跟随（电梯）
        返回顶部（top）
        放大镜效果
        滚动跟随
        轮换图（呼吸灯焦点图）
        突出展示（小心动画累计）
        手风琴效果（小心动画累计）
        列表展示
        模态窗口（登录注册界面）
        单选多选框的个性化
        自定下拉菜单