【day03】Xhtml

一.HTML公共属性
1. title 提示
2. class
3. id
4. style
说明:除了 html,head,body,link,meta外其他标记都可使用的属性
二.表单
1.表单的作用:收集客户端的信息，然后发送到服务器上。
2.表单格式
<form action="服务器的URL .php" method="传输方式get|post" name="表单名称">
    ...
</form>
      说明:
      a. action写服务器的URL
              服务器:装有应用软件的计算机
             WEB服务器：装有提供浏览服务的应用软件
      b. method 默认值 get
      c. get：将信息名/值对附加在浏览器地址栏的后面
                        形如: xx.php?user=tom&pwd=123
                        小文件，不安全
      d. post:将信息名/值对附加在HTTP请求头部
                        中，大文件，安全
      e.表单元素要有有效的名称和提交值

3.表单元素
   (1) 单行文本框
   <input type="text" name="名称" value="值"size="文本框宽度" maxlength="最大字符长度"/>
   (2) 密码框
   <input type="password" name="名称" value="值"size="文本框宽度" maxlength="最大字符长度"/>
   (3)单选框
   <input type="radio" name="名称" value="值"/>
      说明:
     a.一组相同的单选框名称必须相同
     b.单选框必须有有效的提交值 checked="checked"
(4)多选框
   <input type="checkbox" name="名称" value="值"/>
      说明:
    a.一组相同的多选框名称必须相同，并且名称以数组(存多个值)形式存储，形如 :名称[]

    b.多选框必须有有效的提交值 checked="checked"

(5) 下拉列表框
   <select name="名称" multiple="multiple" size="高度">
     <optgroup label="分组名称">
      <option value="名称">...</option>
      <option value="名称">...</option>
     </optgroup>
     ...
   </select>
   说明:
    a.下拉列表框要有有效的提交值 selected="selected"
    b.设置 multiple="multiple"实现多选下拉列表框
      name名称以数组形式存储 ,形如名称[]
(6) 浏览框
   <input type="file" name="名称" value="值"/>
     说明:
        表单中有浏览框具备的条件
    a. method 传输方式必须是post
    b. form标记中添加属性和值
       enctype="multipart/form-data"
(7)多行文本框
   <textarea name="属性" rows="高度" cols="宽度">
         值
   </textarea>
     说明: 多行文本框被HTML在线编辑器替代
(8)按钮
        提交按钮:
     <input type="submit" name="名称" value="值"/>
        普通按钮:
     <input type="button" name="名称" value="值"/>
           注意:必须结合javascript脚本代码实现表单提交
        图像域按钮:
     <input type="image" src="图像URL" name="名称" value="值"/>
        重置按钮
     <input type="reset" name="名称" value="值"/>
       说明:一般不给按钮加 name属性
(9)隐藏域
    <input type="hidden" name="名称" value="值"/>
       说明:给服务器传值，客户端无需理会
(10)总结
   a. <input type="类型" name="名称" value="值"/>
     type:
       text 单行文本框
       password 密码框
       radio 单选框
       checkbox 多选框
       file 浏览框
       submit 提交按钮
       button 普通按钮
       image 图像域按钮
       reset 重置按钮
       hidden 隐藏域

    b.其他
           下拉列表框 <select>...</select>
           多行文本框 <textarea>...</textarea>

三.框架集：
   1.作用:框架集被用来组织实现多个窗口效果，
                   并且每个窗口实现独立的页面
   2.分类
     frameset框架集
     iframe 框架集
   3.frameset 格式
    (1)<frameset rows|cols>
         <frame src="1.html"/>
         <frame src="2.html"/>
       </frameset>
           说明:
         a. frameset 属性
             rows="20%,*" 实现上下窗口
             cols="20%,*" 实现左右窗口
         b.frameset 不能和 body一起使用
         c.检查是否支持框架集
           <noframes>
              <body>此浏览器不支持框架</body>
           </noframes>
    (3)嵌套框架
       <frameset rows="20%,*">
          <frame src="top.html"/>
          <frameset cols="20%,*">
             <frame src="menu.html"/>
             <frame src="main.html"/>
          </frameset>
       </frameset>
    (4) frame 属性
        a.noresize:no|yes 调整窗口
        b.scrolling:no|yes|auto自动设置滚动条
        c.frameborder:框架边框值 0,1

   4.iframe 框架

    <iframe src="目标文档URL"
      width="宽度" height="高度"
      name="框架名称"
      scrolling="no"
      frameborder="0">
      ...
    </iframe>

附带eg代码：

<body>

<form action="index.php" method="get" name="test1">

单行文本框：

<input type="text" name="test-text" value="type类型为text，name名称为test-text，size为100，maxlength为50" size="100" maxlength="50"/>　　<br />

<!--密码框-->

密码框（type类型为password，name名称为test-password，size为100，maxlength为50）：

<input type="password" name="test-password" value="" size="100" maxlength="50"/>　　<br />

<!--单选框-->

单选框：

<br />

<input type="radio" name="test-radio1" value="type类型为radio，name名称为test-radio1"/>　　type类型为radio，name名称为test-radio1　　<br />

<input type="radio" name="test-radio2" value="type类型为radio，name名称为test-radio"/>　　type类型为radio，name名称为test-radio2　　<br />

<input type="radio" name="test-radio3" value="type类型为radio，name名称为test-radio"/>　　type类型为radio，name名称为test-radio3　　<br />

<!--多选框-->

多选框:　　<br />

<input type="checkbox" name="test-checkbox1" value="type类型为checkbox，name名称为test-checkbox1"/> 　　type类型为checkbox，name名称为test-checkbox1　　<br />

<input type="checkbox" name="test-checkbox2" value="type类型为checkbox，name名称为test-checkbox2"/>　　type类型为checkbox，name名称为test-checkbox2　　<br />

<input type="checkbox" name="test-checkbox3" value="type类型为checkbox，name名称为test-checkbox3"/>　　type类型为checkbox，name名称为test-checkbox3　　<br />

<!--下拉列表框-->

下拉列表框：

<select name="test-select" multiple="multiple" size="1">

　　<optgroup label="分组名称">

　　　　<option value="1">1</option>

　　　　<option value="2">2</option>

　　</optgroup>

　　<optgroup label="水果">

　　　　<option value="apple">苹果</option>

　　　　<option value="banana">香蕉</option>

　　　　<option value="orange">橘子</option>

　　</optgroup>

　　<optgroup label="蔬菜">

　　　　<option value="qingcai">青菜</option>

　　　　<option value="xiangcai">香菜</option>

　　</optgroup>

</select>

</form>

<!--浏览框-->

<form action="test-none.php" method="post" name="test2">

浏览框：<input type="file" name="test-file" value="type类型为file,name名称为test-file"/>

<br />

<!--编辑器兼容出错-->

<p>

　　<font color="#0000FF" size="20">

　　　　下面的“多行文本框”“提交按钮”“普通按钮”“图像域按钮”“重置按钮”“隐藏按钮”等标签因编辑器出错无法在此页面做出预览，请移步至另一个页面查看

　　　　<a href="http://down.mykeji.net/upload/da03.html" target="_blank">点击此处查看</a>

　　</font>

</p>

<br />

<br />

<br />

<br />

<!--框架集-->

　　<p>

　　　　<font color="#FF0000" size="20">

　　　　　　框架集标签，因无法在此页面做出预览，请移步至另一个页面查看

　　　　　　<a href="http://ask.mykeji.net/" target="_blank">点击此处查看</a>

　　　　</font>

　　</p>

</body>

【day03】Xhtml的更多相关文章

Python基础【day03】：文件操作（七）
零.本节内容 1.文件常用操作汇总 2.打开文件 3.操作文件 4.关闭文件一.文件常用操作汇总二.打开文件 1.普通打开模式 r,英文:read,只读模式(默认) w,英文:write,只写模式 ...
【前端】XHTML入门笔记
教程/XHTML 模块/XHTML 标准属性/XHTML 事件属性 XHTML 指可扩展超文本标签语言(EXtensible HyperText Markup Language). XHTML 元素必 ...
Python基础【day03】：集合进阶（四）
本节内容 1.关系测试(特殊符号) 1.交集2.并集3.差集4.对称差集5.是否是子集6.是否是父集 2.基本操作 1.add2.update3.remove VS pop vs discard4.l ...
Python基础【day03】：字典进阶（二）
本节内容深浅拷贝循环方式字典常用方法总结一.深浅拷贝列表.元组.字典(以及其他) 对于列表.元组和字典而言,进行赋值(=).浅拷贝(copy).深拷贝(deepcopy)而言,其内存地址是变 ...
Python基础【day03】：入门知识拾遗（八）
本节内容 1.作用域 2.三元运算 3.进制一.作用域对于变量的作用域,执行声明并在内存中存在,该变量就可以在下面的代码中使用. 1 2 3 if 1==1: name = 'wupeiq ...
Python基础【day03】：字符转编码操作（五）
本节内容 1.编码介绍 2.字符编码介绍 3.总结说到python的编码,一句话总结,说多了都是泪啊,这个在以后的python的开发中绝对是一件令人头疼的事情.所以有必要要讲讲清楚一.编码介绍 1 ...
Python基础【day03】：集合入门（三）
本节内容 1.集合常用方法总结2.定义3.关系测试集合是无序的,天生不重复的数据组合,它的作用如下: 去重,即:把一个列表变成集合,就去重了关系测试,即:测试两组集合的交集.并集和差集等一.集合 ...
Python基础【day03】：字典（一）
本节内容简述语法字典的使用字典内置方法一.简述字典是Python中的又一种数据结构,它是通过key-value的数据类型,跟我们小时候用的新华字典差不多,通过key去访问value 二.语 ...
Python基础【day03】：文件操作(六)
一.概述我们工作中需要经常操作文件,下面就讲讲如何用Python操作文件 1.文件操作的流程: 打开文件,得到文件句柄赋值给一个变量通过文件句柄,对文件进行操作关闭文件二.入门 1.语法 op ...

随机推荐

webrtc笔记(3): 多人视频通讯常用架构Mesh/MCU/SFU
问题:为什么要搞这么多架构? webrtc虽然是一项主要使用p2p的实时通讯技术,本应该是无中心化节点的,但是在一些大型多人通讯场景,如果都使用端对端直连,端上会遇到很带宽和性能的问题,所以就有了下图 ...
jQuery 源码解析(三) pushStack方法详解
该函数用于创建一个新的jQuery对象,然后将一个DOM元素集合加入到jQuery栈中,最后返回该jQuery对象,有三个参数,如下: elems Array类型将要压入 jQuery 栈的数组元素 ...
关于 ReadOnlySpan<T>
using System; using System.Linq; namespace BenchmarkAndSpanExample { public class NameParser { publi ...
DAX 第七篇：分组聚合
DAX有三个用于生成分组聚合数据的函数,这三个函数有两个共同的特征:分组列和扩展列. 分组列是用于分组的列,只能来源于基础表中已存的列,分组列可以来源于同一个表,也可以来源于相关的列. 扩展列是由na ...
easyui 扩展 datagrid 数据网格视图
效果如图: js代码: $("#tdg").datagrid({ width: 200, url: "/Laboratory/ ...
java--Proreties
Prorerties /* * Properties,内存与文件信息交互 * 表示了一个持久的属性集 * * 构造方法: * Properties() * * */ //简单使用创建,添加,遍历, ...
maven 学习---将项目安装到Maven本地资源库
在Maven中,可以使用“mvn install”打包项目,并自动部署到本地资源库,让其他开发人员使用它. mvn install 注意,当“install”在执行阶段,上述所有阶段 “validat ...
基于Morphia实现MongoDB按小时、按天聚合操作
MongoDB按照天数或小时聚合需求最近接到需求,需要对用户账户下的设备状态,分别按照天以及小时进行聚合,以此为基础绘制设备状态趋势图. 实现思路是启动定时任务,对各用户的设备状态数据分别按照小时 ...
day 36
目录 pymysql操作mysql 安装连接增删改查索引为什么使用索引以及索引的作用类比索引的本质索引的底层原理索引的种类(重点) 主键索引唯一索引普通索引索引的创建主键 ...
【分布式搜索引擎】Elasticsearch之如何安装Elasticsearch
在Macos上安装一.下载安装过程最新版本下载地址: https://www.elastic.co/cn/downloads/elasticsearch 历史版本下载地址: https://www ...

【day03】Xhtml

【day03】Xhtml的更多相关文章

随机推荐

热门专题