表单

  表单

      表单:表单域:包含了处理表单数据所用的程序的URL以及数据提交到服务器的方法。

          表单控件:(对象、元素):包含了文本框、密码框、隐藏、多行文本框(文本域)、复选框、单选框、下拉列表、文件上传框、提交按钮、复位按钮、一般按钮。

        提示信息:同一个表中还应该添加一些说明性文字,提示用户填写操作。

  表单域

      Form:用于定义采集数据的范围,即设定表单的起止位置,并指定处理表单数据程序的url地址,其基本语法结构如下:
        <form action=“url” method=“get/post” name=“名” >表单内容</form>

        Action:用于设定表单数据文件的URL的地址,这个文件通常是一个后台程序或是一个电子邮件地址。
        Method:指定数据传递到服务器的方式。
        Name:用于设定表单名称,便于其他地方引用表单的值。

      注*1. get是从服务器上获取数据,post是向服务器传送数据。

      2. get是把参数数据队列加到提交表单的ACTION属性所指的URL中,在URL中可以看到。post是通过HTTP post机制,用户看不到这个过程 。

      3. get传送的数据量较小,不能大于2KB。post传送的数据量较大,一般被默认为不受限制。

      4. get安全性非常低,post安全性较高。但是执行效率却比Post方法好。

     

  表单控件(常用)

      文本框:  <input type=“text”  />
      密码框:  <input type=“password”/>
      提交按钮: <input type=“submit” value=“按钮上显示的文字” />
      重置按钮: <input type=“reset” value=“按钮上显示的文字”/>
      跳转按钮: <input type=“button”  value=“按钮上显示的文字”  />

样式表的创建

  CSS的三种样式:

内部样式表

        插入到HTML头部head标签中

        <style>

            CSS语句

        </style>

        说明:内部样式表必须定义在 <head>和</head>之间;页面所有样式都可以写在<style>和</style>之间。

       引用外部样式表

        引用外部样式表 前提需要创建一个CSS文件   链接方式:在HTML文件头部

        <link rel="stylesheet" href="样式表路径及全称" type="text/css" />

        说明:rel="stylesheet"是指这个link和其href之间的关联样式为样式表文件

           type="text/css" 是指文件类型是样式表文本

        <style>

            @import url(样式表路径及全称);

        </style>

      *link与import导入外部样式的区别

         1.link属于XHTML标签,而@import是CSS提供的一种方式。link除了可以加载CSS,还可以定义RSS、rel连接属性等,@import只能加载CSS

         2.加载顺序的差别:当一个页面被加载时,link引用的CSS会同时被加载,而@import引用的CSS会在页面被全部下载完再被加载。

         3.兼容性的差别:@import只能在IE5以上的浏览器识别(@import是CSS2.1被提出的),link则没有该问题。

         4.使用dom控制样式的差别:当使用JavaScript控制dom改变样式时,只能使用link,@import不是dom可控制的

       内联样式表(行间样式、行内样式、嵌入式样式)

        <标签 style="属性:属性值;属性:属性值;"></标签>

       

      

      样式表的作用域

        内联样式表的优先级最高

        内部样式表与引用外部样式表的优先级与其先后顺序有关

        内联样式表的作用域是当前标签,内部样式表的作用域是当前文件,外部样式表的作用域是所有关联的文件

CSS的基础语法

  CSS是由两部分组成:选择符和声明    其中声明是由属性和属性值组成,具体格式如下

  

  注* 不同的属性之间要用英文分号隔开

基础选择符

  类型选择符

      标签名称{属性:属性值;}

      类型选择符就是网页元素本身,定义时直接使用元素名称。例:p{color:red;}

  ID选择符

      #id名{属性:属性值;}

      在使用ID选择符前,为元素定义一个ID属性。

      ID选择符可对元素进行一个ID名的指派,是对每一个页面中的唯一出现的元素进行样式定义

      例:html:<div id="top"></div>

        CSS:#top{font-size:12px;color:blue;}

  class选择符

      类(class)名{属性:属性值;}

      对同类标签进行不同的样式设定;对不同类的标签进行同样的样式设置

      例:CSS:.txt{font-size:12px;color:blue; }

        html:<div class="txt">111</div>

           <div>222</div>

           <div class="txt1">333</div>

  群组选择符

      通配符 "  * "

      *{属性:属性值;}

      其含义就是所有元素

      例:*{margin:0; padding:0;}将所有元素的边界值和填充值清零。 margin:0 auto;使元素居中

  包含选择符

      父元素 子元素......{属性:属性值;}

      对某个对象的子对象定义样式

      例:div a{font-size:12px; }     可多级包含,标签之间用空格空开

  子选择符

      父元素 > 子元素{属性:属性值;}

      不选择任意的后代元素,而是选中某个元素的子元素

      例:h1 > strong{color:red;}

  伪类选择符

      a:link{属性:属性值;}超链接的初始状态;

      a:visited{属性:属性值;}超链接被访问后的状态;

      a:hover{属性:属性值;}鼠标划过超链接时的状态;

      a:active{属性:属性值;}即鼠标按下时超链接的状态;

拓展

      html的注释

      <!--注释内容-->

      css的注释

      /*注释内容*/

HTML学习 day03的更多相关文章

  1. Python学习 day03打卡

    今天学习的主要内容: ppython的基本数据类型: 1. python基本数据类型回顾 2.int---数字类型 4.str---字符串类型 一.python基本数据类型 1. int==>整 ...

  2. python开发学习-day03(set集合、collection系列 、深浅拷贝、函数)

    s12-20160116-day03 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: ...

  3. Python学习day03 - Python基础(1)

    1. 执行Python程序的两种方式 (1)交互式(Jupyter) 优点:运行一句执行一句 缺点:关闭即消失# (2)命令行式(pycharm) 优点:可以一直保存 缺点:全部写完才能调试bug虽然 ...

  4. Java学习day03

    day03 课堂笔记 1.数据类型 2.总结第二章到目前为止所学内容: * 标识符 * 关键字 * 字面值 * 变量 成员变量如果没有赋值,系统会自动赋值,而局部变量不手动赋值,则会编译不通过. * ...

  5. python学习-day03:整形、字符串常用方法:

    一.数字,int 1.1: a.int(object)转化数字类型: a=' b=int(a) b=b+1000 print(b) 223 <class 'int'> 答案 b.转化二进制 ...

  6. 学习day03

    1.结构标记  *****   做布局    1.<header>元素    <header></header>    ==> <div id=&quo ...

  7. 大数据学习--day03(运算符、流程控制语句)

    运算符.流程控制语句 自增自减容易出错的地方: 扩展的赋值运算符  a+=b 等同于 a = a+b;  扩展的赋值运算符 隐含了一个类型的强制转换 & && 有何区别   & ...

  8. Python学习 day03

    一.基本数据类型 python中的基本数据类型有以下几种: int   --  整数     python3中默认整数都是int型,python2中int的范围为-231~232-1(32位系统中)/ ...

  9. 黑马MySQL数据库学习day03 级联 多表查询 连接和子查询 表约束

    /* 存在外键的表 删表限制: 1.先删除从表,再删除主表.(不能直接删除主表,主表被从表引用,尽管实际可能还没有记录引用) 建表限制: 1.必须先建主表,再建从表(没有主表,从表无法建立外键关系) ...

  10. Java 学习 day03

    01-语句(while) 02-语句(do while) 03-语句(for) 04-语句(for和while的区别) 05-语句(循环语句的其他特点) 06-语句(for语句练习-累加&计数 ...

随机推荐

  1. Cypress安装使用(E2E测试框架)

    一.简介 Cypress是为现代网络打造的下一代前端测试工具,解决了开发人员和QA工程师在测试现代应用程序时面临的关键难点问题. Cypress包含免费的.开源的.可本地安装的Test Runner  ...

  2. Redis在Window下的安装部署

    一.下载 由于redis官方不支持windows,所以需要在github上下载window的版本:下载地址.redis约定版次版本号(即第一个小数点后的数字)为偶数的版本是稳定版本(如2.8,3.0) ...

  3. Specify Action Settings 指定按钮设置

    In this lesson, you will learn how to modify Action properties. The ClearTasks Action will be used. ...

  4. Taro自定义Modal对话框组件|taro仿微信、android弹窗

    基于Taro多端实践TaroPop:自定义模态框|dialog对话框|msg消息框|Toast提示 taro自定义弹出框支持编译到多端H5/小程序/ReactNative,还可以自定义弹窗类型/弹窗样 ...

  5. Pandas处理超大规模数据

    对于超大规模的csv文件,我们无法一下将其读入内存当中,只能分块一部分一部分的进行读取: 首先进行如下操作: import pandas as pd reader = pd.read_csv('dat ...

  6. xip.io

    gg gg "" "" ,gg, ,gg gg gg,gggg, gg ,ggggg, ""8b,dP" 88 I8P" ...

  7. 通过JTAG对比内核启动后text/rodata段内容

    关键词:vmlinux.strip.dump._text.__end_rodata等等. 在日常的调试中,可能会在某些情况下踩到内核重要的数据,比如代码段或者rodata之类. 这种情况下,需要确认这 ...

  8. Linux:用户权限管理

    用户与用户组的概念 超级用户 拥有对系统的最高管理权限,默认是 root 用户 普通用户 只能对自己目录下的文件进行访问和修改,具有登录系统的权限. 虚拟用户 也叫"伪"用户,这类 ...

  9. CodeForces - 763A(并查集/思维)

    题意 https://vjudge.net/problem/CodeForces-763A 一棵无根树中各个节点被染上了一种颜色c[i] 现在让你选择一个点作为根节点,使得这个根节点的所有儿子满足以该 ...

  10. 问题解决:ImportError: No module named tensorflow

    环境: python3.5.3+pycharm2018.2EAP 问题描述: Pycharm编译报错 ImportError: No module named tensorflow 解决方法: ten ...