新知识

Posted 2020-08-18

跑马灯标记

<marquee></marquee>

常见属性：

l  direction：滚动的方向  取值 left(默认值  从右向左进行滚动)、right、up、down

l  behavior：滚动的方式  取值：scroll(滚动 默认值)  slide(滑动 只滚动一次)  alternate(弹动  打乒乓球一样 )

l  width：设置宽度 

l  height：设置高度

l  bgColor：设置背景颜色

l  scrollAmount：滚动的步长值    一步走多远    值越大速度越快

 

超链接

<a></a>

通过这个标记就可以实现超级链接

常见属性：

      href：要跳转的链接的URL地址

      target：目标文件的打开方式 

                 _self   在本窗口中打开   默认值

                 _blank   在新窗口中打开 

                 _top   

                 _parent

锚点

                

      name：用来实现锚点链接

      id     用来实现锚点链接

锚点链接

作用：链接到一个网页的不同的地方

 

要实现锚点链接需要有两步：

第一步：需要先定义一个锚点链接

           <a  name=”锚点名”></a>或者

           <a  id=”锚点名”></a>

     

第二步：然后找到这个定义的锚点链接

           <a  href=”#锚点名”>回到顶部</a>

图片标记

<img  />

常见属性：

      src：图片的地址  这里的地址可以是相对路径 也可以是绝对路径  还可以是互联网上面的图片地址

      alt：当图片不存在的时候 显示的文字信息

      title：当鼠标放在图片上面时 显示的文字信息

      border：给图片设置边框 

      width:设置图片的宽度

      height：设置图片的高度

 

如何去保证一张图片不变形：只需要设置宽度或者高度其中一个就可以了

 

 

表格

table标记的属性

l  border：表格的边框   取值：1~n

l  borderColor：表格中边框的颜色

l  width：设置表格的宽度  取值：固定值或者百分比    百分比它是相对于当前元素的父元素来作为标准

l  height：设置表格的高度   但是这个属性一般不建议使用

l  align：设置表格的水平对齐方式   取值：left(默认值)|right|center

l  bgColor：设置表格的背景颜色

l  background：设置表格的背景图片 

l  cellpadding：表格中单元格里面的内容到单元格边框之间的距离

l  cellspacing：表格中单元格与单元格之间的距离

 

 

tr的常见属性

l  bgColor：设置行的背景颜色

l  background：设置行的背景图片

l  width：设置行的宽度  

l  height：设置行的高度

l  align：设置行中的内容水平方向对齐方式   取值：left(默认值)|center|right

l  valign：设置行中的内容垂直方向对齐方式  取值：top(顶部对齐)|middle(默认值) 中间对齐 |bottom  底部对齐

 

td或者th的常见属性

width：设置单元格的宽度

height：设置单元格的高度

bgColor：设置单元格的背景颜色

background：设置单元格的背景图片

rowspan：跨行合并单元格

colspan：跨列合并单元格

 

注意：

l  首先要明确是跨行还是跨列 

l  其实要开始在第一个合并单元格里面写属性

l  要减去对应的单元格的数量  n-1

 

表格的标题标记

<caption></caption>  这个表示是table的子标记 它是用于来设置表格的标题

表格的隐藏标记

<thead></thead>  表示表格的头部

<tbody></tbody>  表示表格的主体部分    可以有多个 

<tfoot></tfoot>    表示表格的尾部    它一般是用来做统计用 

 

很细的边框的表格

 

 

图像热点

给一张图片增加多个超级链接 

给一张图片设置一个超级链接

<a href=”#”><img src=”图片”/></a>

 

一定先要有图片 

格式：

      <img  src=”图片的地址”  usemap=”#名称”>

      <map  name=”它要和img标记里面的usemap的属性值一样”>

           <area  shape   coords=””  href=””  title=”当鼠标放上图片上面时显示的文字”/>

           <area />

           <area />

</map>

 

area标记的属性：

      shape：表示区域里面的形状   取值：rect(矩形)、circle(圆形)、poly(多边形)

coords：坐标值

      如果形状设置为 rect(矩形)时  那么坐标值应该有4个:x1,y1,x2,y2

      如果形状设置为 circle(圆形)时  那么坐标值应该有3个:x1,y1,r

      如果形状设置为 poly(多边形)时  那么坐标值应该有根据多少边来决定

多媒体标记

<embed />  html5

常见的属性：

      src：要引入的源文件地址

      width：设置宽度

      height：设置高度

 

表单

一、<form>

      表单的控件

</form>

 

form标记的属性：

• action：表单数据的处理程序  将表单的数据交给“谁”来进行处理  如果说不填写这个属性 则表示交给当前的来进行处理 
• method：表单数据的提交方式   取值：GET|POST

n  如果method这个方法不写的话  表单的提交方式就是get 

n  GET方式将所有的表单数据显示在浏览器的地址栏中   路由分发

n  表单的处理程序?name的属性值=value的属性值& name的属性值=value的属性值

n  安全性不高  只能提交少量的数据  100字节左右

n  POST方式  需要指定   method=”post” 

n  它不会将表单的数据显示在浏览器的地址栏中  它是直接发送给后台

n  相对安全一些 可以提交大量的数据  跟服务器的配置有关 

• enctype：表单数据的编码方式   一般情况下都不用写  只有在文件上传的时候才需要写

n  application/x-www-form-urlencoded  默认就是它  普通的加密方式 

n  multipart/form-data   多文件的方式进行上传   如果是使用文件上传 那么method这个属性的属性值必须为POST方式 

二、表单控件

所有的表单控件 只有把它们放置在form标记里面才可以进行数据的收集 

 

单行文本框：

      <input  type=”text”   name=”名称”  value=”值”  size=”设置宽度”  />

文本框里面的内容是明文显示的
单行密码框：

       <input  type=”password”  name=”名称”  value=”值”  size=”设置宽度”  />

      密码框里面的内容是以*显示的
单选按钮：

      <input  type=”radio”  name=”名称”  value=”一定要写”  checked=”checked”/>

      要实现一组相互排斥的按钮 那么这一组按钮的name属性值必须要一样

多选按钮：

      <input  type=”checkbox”  name=”名称[]”  value=”一定要写”  checked=”checked”/>

提交按钮：

      <input  type=”submit”  name=”名称 不建议写”  value=”值”  />

      具有将表单数据提交到服务器的功能   

重置按钮：

      <input  type=”reset”  name=”名称 不建议写”  value=”重置”  />  不重要

      这个按钮具有表单数据的重置功能  就是将表单里面的数据全部清空

普通按钮：

      <input  type=”button”  name=”名称 不建议写”  value=”值” />  

      普通按钮它不具有表单提交的功能  同时也不具有表单重置的功能  它只是一按钮而已   它一般需要配合JS来进行使用 

图片按钮：

      <input  type=”image” src=”图片的地址URL”  />

      这个图片按钮具有表单数据的提交功能  它会将点击图片上面的坐标值也发送到后台

 

 

文件上传：

      <input  type=”file”  name=”名称”  />

要实现文件上传的功能  

form标记里面的method=”POST”  enctype=”multipart/form-data”

隐藏域：

           它可以将一些表单中的数据不显示在浏览器中 但是这个数据又需要提交到服务器中 我们就可以使用隐藏域来隐藏

           <input  type=”hidden”  name=”名称”  value=”值”  />

 

       使用button这个双边标签来实现按钮

提交按钮：

      <button  type=”submit”>提交</button>   我们建议使用button标记来实现按钮 

      这个按钮具有表单按钮的功能

重置按钮：

      <button  type=”reset”>重置</button>

普通按钮：

      <button  type=”button”>普通</button>

注意：如果button标记里面的type没有写  在form标记里面 这个按钮它具有表单的提交功能  如果在form标记的外面 它就是一个普通按钮

 

下拉列表：

      它是一组标记

      <select>

      <option>请选择以下的省份</option>

      <option>北京 </option>

      <option>广东 </option>

</select>

 

文本域：

      <textarea  rows=”行数”  cols=”列数”  name=”名称”></textarea>

框架型网页的结构：

      <frameset  rows=”将这个框架网页设置为上下型”  cols=” 将这个框架网页设置为左右型”>

           <frame  />

           <frame  />

</frameset>

frameset这个标记它用来定义这个框架网页是上下还是左右型

属性：

      rows=”80,*”   将窗口分割为上下型   上边的窗口占据80个像素  剩下的所有的空间都给到下窗口 

      rows=”80,100,*”  将窗口分割为上中下型  上边的窗口占据80个像素  中间的窗口占据100个像素   剩下的所有的空间都给到下窗口 

      cols=”100,*”   将窗口分割为左右型  左边的窗口占据100个像素  剩下的所有的空间都给到右窗口 

      cols=”100,80,*”   将窗口分割为左中右型  左边的窗口占据100个像素 中间的窗口占据80个像素   剩下的所有的空间都给到右窗口

      border：用来设置框架网页的边框的粗细

      borderColor:边框的颜色

 

 

frame这个标记表示小窗口  这个框架网页里面有多少个小窗口 就要有多少个frame这个标记

src：它可以引入外部的HTML网页或者是其它的网站都可以

name：设置小窗口的名称   这个属性非常重要 

noresize：表示是否可以去调整小窗口的大小

scrolling：是否显示滚动条  auto|yes或者1  |no或者 0