HTML_CSS

<!--一、表单   <form></form>   

表单就是用来进行数据提交的标签

表单就是一对<form></form>标签,里卖弄包含其他的标签input等

action    表示提交的目标服务器  就是点击提交时跳到哪

method    提交的方法get/post

--》表单提交有有get与post之分

    ---》get就是默认的,就是通过浏览器地址提交

---》post就是将要提交的东西隐藏到报文里提交

1、文本框标签

    <input>

属性:

  type   类型,比如说type="text"就是文本框  type="submit"就是提交按钮

    --》text    文本框

--》submit  提交按钮

    --》password  密码框

  value  

  readonly

  maxlength  允许文本框输入的最大长度

  size       文本框的大小

2、密码框标签

  <input type="password" name="" value="" />

3、隐藏标签  用来记录页面跳转时的信息,但是由于该信息不该显示在页面中,如果显示了会破坏整个页面的美观等东西,因此使用隐藏标签将其隐藏

<input type="hidden" value=""/> 

4、文本域标签  一般用来展示协议等信息,与pre标签格式上有点类似

    <textarea rows="50" cols="10"></textarea>

属性:

rows   长

    cols高

二、按钮标签

     --》  重置按钮

<input type="reset" value+"清除所有数据" />

--》button按钮

该按钮没有任何响应,由用户进行定义

<input type="button" value="button上显示的文本" />

--》图像标签

       <input type="image" src="图片地址"/>

--》disabled属性  相当于C#里的enable属性

        <input type="button" value="点击按钮" disabled />

三、复选框标签  如果想把内容提交那就加上name / value属性

   <input type="checkbox" />看电影

想让复选框默认选中加   checked

  --》leabel  可以将某个数据与某个空间绑定

  1、为目标空间加一个id属性

  2、添加label标签,使用for属性指定id

  <input type="checkbox" name="c1" value="eat" id="123" /><label for="123">吃饭</label>

  --》快速定位  就是键盘上的快捷键  要考虑兼容性

     accesskey属性  要注意和浏览器的快捷键冲突

在IE上要使用alt+键

  mac等这些浏览器中直接使用键

    <input type="checkbox" name="c1" value="eat" id="123" /><label for="123" accesskey="a">吃饭</label>

单选标签  要给标签命名,不然它不知道和谁一组选不了

  <input type="redio" name="1" value="male" checked="checked"/>男

   <input type="redio" name="1" value="fmale"/>女

    <input type="redio" name="1" value=""/>其他

文件选择标签

<input type="file">

四、下拉菜单标签  (相当于combobox  listbox)

提交用的属性

       name    value

后台要一个集合来维护 不要直接提交每一项里的内容给后台的集合,不好,给每一项一个value

默认选中:selected属性

  size属性:显示几行

  multiple:多选

   <select name="email" size="6" mutiple="multiple">

<option value="-1">--请选择--</option>

<option value="0" selected="selected">@163.com</option>

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

<option value="2">@qq.com</option>

<option value="3">@yahoo.com</option>

<option value="4">itcast</option>

   </select>

分组    <optgroup></optgroup>

-->

<html>

<head>

<title></title>

</head>

<body>

<form>

<!--写一个文本框-->

<input type="text" name="uid" value=""/>

<!--要提提交数据,必须要满足两个条件

1、放在FORM中

2、必须要有name   value属性

-->

<!--写一个提交按钮-->

<input type="submit" name="点击提交"/><br />

<!--在表单标签中,所有的标签格式等HTML的处理与表单一样-->

   <input type="text" name="readonly" readonly="readonly" /><br />

<input type="text" name="" maxlength="6" /><br />

<input type="text" name="" size="2" /><br />

<!--密码标签-->

<input type="password" name="" value="">

</form>

</body>

</html>

  1、meta标签

  2、帧标签  (不需要body标签了)

  frameset就好比页面的显示区,有两个重要的属性

  --》rows  (横向)

框架被分成几行几列

  --》cols   (竖向)

  <frameset rows="50%,*">

<frame src="地址"></frame>

<frame src="地址"></frame>

  </frameset>

3、分区标签

--》<div>   默认是行标签,被圈起来的内容会独自占一行

   <div style="display:in">

--><span>    默认行内标签,不会换行

三、CSS

1、样式

  --》<div>

长宽width、height

border 1px solid red    表示边框宽度为1  是实线  边框的颜色是红色

---》内联样式

<div style="border:1px solid red; width:50px; height:30px">

</div>

我们发现样式写在标签中,每一个标签都得有眼格式,还是不好维护,

定义一个“东西”,如果整个页面中每个div都是我这个样式

---》内嵌样式

   1、在head标签中写上一对style标签

   2、 添加属性type="text/css"

   3、在style标签中写样式即可

样式的注释和C#的行间注释一样,用斜线星号 星号斜线  /*   */

--->外部样式

考虑统一样式可以应用 于个多页面,使用外部样式,那么像使用类库一样可以共享重用

         1、新建一个文件夹,一般命名为style

2、在style文件夹中新建一个文件夹,命名为css1.css

数往知来 HTML<十一>的更多相关文章

  1. CRL快速开发框架系列教程十一(大数据分库分表解决方案)

    本系列目录 CRL快速开发框架系列教程一(Code First数据表不需再关心) CRL快速开发框架系列教程二(基于Lambda表达式查询) CRL快速开发框架系列教程三(更新数据) CRL快速开发框 ...

  2. 我的MYSQL学习心得(十一) 视图

    我的MYSQL学习心得(十一) 视图 我的MYSQL学习心得(一) 简单语法 我的MYSQL学习心得(二) 数据类型宽度 我的MYSQL学习心得(三) 查看字段长度 我的MYSQL学习心得(四) 数据 ...

  3. WCF学习之旅—第三个示例之五(三十一)

       上接WCF学习之旅—第三个示例之一(二十七)               WCF学习之旅—第三个示例之二(二十八)              WCF学习之旅—第三个示例之三(二十九) WCF学习 ...

  4. [占位-未完成]scikit-learn一般实例之十一:异构数据源的特征联合

    [占位-未完成]scikit-learn一般实例之十一:异构数据源的特征联合 Datasets can often contain components of that require differe ...

  5. 关于大型网站技术演进的思考(二十一)--网站静态化处理—web前端优化—下【终篇】(13)

    本篇继续web前端优化的讨论,开始我先讲个我所知道的一个故事,有家大型的企业顺应时代发展的潮流开始投身于互联网行业了,它们为此专门设立了一个事业部,不过该企业把这个事业部里的人事成本,系统运维成本特别 ...

  6. CPrimerPlus第十一章中的“选择排序算法”学习

    C Primer Plus第十一章字符串排序程序11.25中,涉及到“选择排序算法”,这也是找工作笔试或面试可能会遇到的题目,下面谈谈自己的理解. 举个例子:对数组num[5]={3,5,2,1,4} ...

  7. 无废话ExtJs 入门教程二十一[继承:Extend]

    无废话ExtJs 入门教程二十一[继承:Extend] extjs技术交流,欢迎加群(201926085) 在开发中,我们在使用视图组件时,经常要设置宽度,高度,标题等属性.而这些属性可以通过“继承” ...

  8. GPS部标监控平台的架构设计(十一)-基于Memcached的分布式Gps监控平台

    部标gps监控平台的架构,随着平台接入的车辆越来越多,架构也面临越来越大的负载挑战,我们当然希望软件尽可能的优化并能够接入更多的车辆,减少在硬件上的投资.但是当车辆增多到某一个临界点的时候,仍然要面临 ...

  9. 双十一 VS 火车票(12306)

    火车票开售了,又是一年,code了一年,咱们也该回顾回顾了. 还记得12306上线之初各种技术大牛给人家出方案,吐槽人家外包费用?我们来回顾回顾. 就园子里都过千篇文章来侃这事儿,请问有多少主题的文章 ...

随机推荐

  1. sqlite3加密支持

    sqlite3加密支持 sqlite3免费版并不支持加密,不过留有接口,有不少开源的加密实现,不过有的需要使用openssl配置略显繁琐,不过使用wxsqlite比较方便. wxSqlite3 wxS ...

  2. Android HTTPS(4)直接用SSLSocket,黑名单,客户端证书

    Warnings About Using SSLSocket Directly So far, the examples have focused on HTTPS using HttpsURLCon ...

  3. hdu4422The Little Girl who Picks Mushrooms

    4422 小于等于3 的时候就是1024 4的时候 讨论 5的时候讨论 注意重量为0的情况 #include <iostream> #include<cstdio> #incl ...

  4. 线段树总结 (转载 里面有扫描线类 还有NotOnlySuccess线段树大神的地址)

    转载自:http://blog.csdn.net/shiqi_614/article/details/8228102 之前做了些线段树相关的题目,开学一段时间后,想着把它整理下,完成了大牛NotOnl ...

  5. Incorrect key file for table '/tmp/#sql_882_0.MYI'; try to repair it

    修表方法如下: 一法:. check table 和 repair table 方法1,进入Mysql 的Dos控制台,输入密码进入 2,use database;(你的数据库名) 3, check  ...

  6. 修改tomcat小猫图标

    网站放到网上去了,不喜欢大家访问的时候可以看到tomcat的小猫图标.今天在网上搜了搜,总结一下收藏了. 1.直接找个16*16的ico图片.放到tomcat/root下,取个名叫favicon.ic ...

  7. 函数buf_pool_init

    /********************************************************************//** Creates the buffer pool. @ ...

  8. [ionic开源项目教程] - 第11讲 封装BaseController实现controller继承

    关注微信订阅号:TongeBlog,可查看[ionic开源项目]全套教程. 截止到第10讲,tab1[健康]模块的功能基本已经完成了,但这一讲中,controller层又做了较大的改动,因为下一讲中t ...

  9. HDU 4998 (点的旋转) Rotate

    为了寻找等效旋转操作,我们任选两个点P0和Q0,分别绕这n个点旋转一定的角度后最终得到Pn和Qn 然后已知:P0和Pn共圆,Q0和Qn共圆.所以要找的等效旋转点就是这两个线段的垂直平分线交点O. 等效 ...

  10. (六)6.5 Neurons Networks Implements of Sparse Autoencoder

    一大波matlab代码正在靠近.- -! sparse autoencoder的一个实例练习,这个例子所要实现的内容大概如下:从给定的很多张自然图片中截取出大小为8*8的小patches图片共1000 ...