之前学过一些Html,平时不怎么用,忘的差不多了,学习Android之前看视频把Html一些先要知识点标签啥的总结理清了一遍,拿出来分享一下,毕竟学Android这一方面懂的不一定要有多深,但基础的要知道
Html规范
- html不区分大小写
- html结构:
- 1,文档的声明:告诉浏览器,页面用的html标准是啥标准
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
- //HTML 4.01 Transitional,比较严谨的
- 2,head部分,
<meta charset="UTF-8">
//编码<meta name="Generator" content="EditPlus">
//编辑器<meta name="yyshui" content="">
//作者author<meta name="Keywords" content="">
//关键字,给个值,可以在服务端拿到<meta name="Description" content="">
//描述,提供给搜索引擎,提高搜索速度
- 3,body身体
- 需要写的代码都要放在body里面
- 1,文档的声明:告诉浏览器,页面用的html标准是啥标准
排版标签
<p></p>
段落,单独占一行
* 内标签align,属性:left,center,right<br>
换行
* p标签多了一个空行,br标签是没有空行的
* br标签没有属性<hr>
线:默认是一条线,单独占一行,不能跟别的放在一行,如果实在想,可以用表格解决
- 属性:
- width(长度)(html中单位只有一个:像素px)
- 绝对
width = "500"
;相对,用百分比width = "50%"
(浏览器宽度的一半)
- 绝对
- size(粗细)
- color颜色
- noshade不要阴影
< hr width = "500" size = "10" color = "red">
- 竖向:
width = "5" size = "100"
- width(长度)(html中单位只有一个:像素px)
- 属性:
<center>
里面的内容都在浏览器的中间<pre></pre>
预格式化<!-- -->
注释,eclipse中快捷键Ctrl+Shift+/就可以调出<div></div>
块级标签
* 把它作为一个整体,一个块来对待,可以一块一块的来设计
* 块级标签必须单独占一行
- 属性:
- align
- 属性:
<span></span>
作用和div一样
* 区别:<span>
不换行
* 作用:比较填一个表单
字体标签
<h></h>
规定字体的大小
- 从h1到h6
- 属性:align
- 字体标签
- 属性(3个)
- face字体
- size大小,取值只能从1到7,大于7按7算
- 再大不行了,还想再大必须通过css来解决
- color颜色(写法有三种)
- 1,英文单词
- 2,16进制,加#(红,绿,蓝)#FF0000红
- 3,三原色
new RGE(122,233,10)
- 属性(3个)
- 特殊字符:解决出现冲突的情况
* 空格: 
*<
小于>
大于,&
&符号"
双引号'
单引号
©
版权™
商标
空格
扩展:绐
<b></b>
粗体bold<strong></strong>
粗体<i></i>
斜体italic<em></em>
斜体<u></u>
下划线<s></s>
删除线(中划线)
图片标签<img>
- src图片位置
- title提示性文本(公有属性)
- Alt替代,当图片显示不出来的时候代替图片显示的内容
border: 边框
图片加超链:
*<a href = "XXX.html"><img src = "images/1.jpg" width = "300" height = "300"></a>
- 点一个图片的特定位置可以进去,其它地方进不去(局部区域加超链)
- 用dreamweaver(热点)做,可以在里面找到坐标
- 点一个图片的特定位置可以进去,其它地方进不去(局部区域加超链)
图片align属性
* 指图片和周围文字的一个相对位置(不是指图片的居中),默认是在底部(文字在图片的底部),还有top,middle
* left图片在文字的左边
超链接
<a></a>
三种形式
- 1,外部链接:连接到一个外部文件
<a href = "XXX.html">XXX</a>
- 2,锚链接:是指连接到本页面或者其他页面的特定位置
- 首先要建立一个锚
<a href = "XXX.html" name = "a">XXX</a>
<a href = "#a">
回到顶部</a>
(必须加#,这样不会把它当作一个文件夹来对待)- 如再想到某页面的锚点
<a href = "XXX.html#a">
回到顶部
- 首先要建立一个锚
- 3,邮件链接
*<a href = "mailto:XXX@163.com">进入我的邮箱</a>
- 1,外部链接:连接到一个外部文件
- target:用来告诉浏览器该用什么方式打开目标页面
* _self:本浏览器中打开(当前页面所在的浏览器)
* _blank:打开一个新的浏览器(新选项卡)
* _parent(只能用在框架中)
* _top(只能用在框架中)
清单标签(3种)
<ul></ul>
无序(unorderlist)
- 里面的每一项是
<li></li>
- 默认情况下是圆点
- 属性type:清单标签显示的图标是什么(w3c规定了3个,如果想放其它的要通过css来解决),也可以在li上用
- 圆点disc
- 方形square
- 空心圆circle
- 里面的每一项是
<ol></ol>
orderlist有序
- 默认阿拉伯数字
- type取值:1,a,A,i,I
- start从几开始
<dl></dl>
difineList定义清单
<dt>
清单标题<dd></dd>
清单项,相当于li
表格标签
<table></table>
表格
- 表格是由行组成
<tr></tr>
- 列叫作单元格
<td></td>
- 表格是由行组成
- 属性
- border边
- align中center表格居中,要想让里面的内容居中,得设td的属性
- width,height
- cellpadding,
- cell单元格,padding内容到边的距离
- 默认字紧挨着左边的
- cellspacing,
- spacing间距,单元格与单元格的间距,即边的粗细
- bordercolordark
- 边框颜色的暗色,对于外面的表格是右边和下边,对于单元格来说是上边跟左边
- bordercolorlight
- 边框颜色的亮色,对于外面的表格是上边跟左边,对于单元格来说是右边和下边
- //想要它有一种3D的效果
- bgcolor,设置起个表格的背景颜色
- background,背景图片
- 注:如果两者同时出现的话,background的优先级比bgcolor高
- 公有属性dir(方向direction)
- 告诉浏览器表格里的内容方向排列是从左到右还是从右到左,只有这两个
- rtl(right to left)
- ltr(left to right)
- tr行,里面可以有bgcolor属性,但是没有background属性,想要一行里面加,可以在css里加
- td单元格,bgcolor,background
*align(水平居中) = "center"
,可以内容居中,让表格中所有的内容都居中,用css
*valign(垂直居中) = "top","middle","bottom"
- 合并单元格
rowspan = "2"
,表示占两行,还要删个单元格solspan = "2"
,占两列
<th></th>
相当于td+b
,将里面的内容加粗,其它属性跟td一模一样<caption>
标题- 放在哪都行
- 属性align,默认是上边的中间,还有left和right,bottom(底下)
<thead></thead>
<tbody></tbody>
<tfoot></tfoot>
* 写与不写有两个区别:
* 1,写了顺序可以任意用,浏览器解析时还是按照thead,tbody,tfoot的顺序显示
* 2,当表格的内容非常多的情况下,不传所有的传了才能显示
* 3, 写了可以边传输边显示
框架(可以一个浏览器中显示多个页面)
- 不要把框架写到body标签中,写在里面意味着只显示一个页面
- 先把它分成上下两个部分,用
<frameset></frameset>
框架集来分
*<frameset rows = "200,*">
,分成上下两部分上面200个像素,"*"
是剩下的
* 下面形成两个<frame></frame>
,每个框架可以放一个页面
* 然后用src链接网址
* cols分成左右两个框架集
- 想要分成多少行多少列就会有多少个逗号
- noresize不想让你拖动,在frame里加
scorolling = "no"
,不让用滚动条- bordercolor框架边颜色,所有的都想要颜色就写在frameset标签里
- 框架当中的超链
* 给名字,name属性,然后用target属性来调用 - 内嵌框架:在页面上挖了一块来显示
* 只有ie浏览器支持,其它的都出不来效果
<iframe></iframe>
(i就是inner)- 可以设定大小width,height
- 不想要滚动条
scrolling = "no"
表单标签(非常重要!!!)
- 作用:用来搜集数据
<form></from>
- 提交的方式
action="页面.html"
,要把它提交到哪个页面,提交到服务器上的是value的值,键值对(有名字的) method,默认get方式
* 把提交的内容附加在网址的后面
* 还有一种post,地址栏后面没有附加,这种方式安全
* 区别1,安全;2,数据大小,get有限,不得超过1k文本框
<input>
(3种)(type属性是指这个框是一个什么样的框)type = "txt"
,是一个输入框(普通)
- value指文本框中的内容,里面的值是我们要传给服务器的值,是需要提交的信息
- size长度,单位不是像素,是字符,表示可以显示多少个字符
- readonly只能读不能写
- 连光标都不见disable(公有属性)
- 密码框
type = "password"
- 隐藏框
type = "hidden"
,里面的内容不是让你输的,也不想让你看到,提供给程序员你自己发送一些数据 - 单选按钮
type = "radio"
,默认把页面上名字相同的作为一组,才会达到单选的功能 ,里面value是提交给服务器的
- 必须给一个名字,checked默认选中
多选框checkbox,
- name可以不一样,区别只在于服务端拿的方式不同,名字一样,拿的时候是个数组,不一样时只能一个一个的拿
button普通按钮,value按钮上显示的文字
<input type = "button" value= "普通按钮"></input>
- 主要提供给javascrip,来调用javascrip来进行一些动态的效果
- 提交按钮submit
<input type = "submit" value= "提交按钮"></input>
- 将会把表单里的信息提交给action所规定的页面
- 重置按钮reset
<input type = "reset" value= "重置按钮"></input>
- 重新置换到表单中的控件初始的状态(form里面)
- 图片按钮image
<input type = "image" src = "image.jpg" width = "80" height = "30"></input>
- 功能和提交按钮完全一致,就是让看着好看一点
- 下拉框
<select></select>
- 里面的每一项叫
<option></option>
- value可以写中文也可以写英文
- multiple可以进行多选
- 里面的每一项叫
- 备注(多行文本框)textarea
- 行:rows
- 列:cols
- 普通按钮
<button></button>
作用跟上面完全一样,可以把type当作一个标签来使用,同样可以给它加事件
- 表单的语义化
- 一个是必填的一个是选填的
<fieldset></fieldset>
,就会给你加两个框,只起一个美化作用
- 下面加一个标签
<legend>必填信息</lengend>
(标题一样的)
- 下面加一个标签
- 一个是必填的一个是选填的
多媒体标签(希望页面上播放一些音乐,视频)
<bgsound></bgsound>
播放背景音乐src属性
- loop播放多少遍,负数永远不会停
<embed></embed>
播放视频4.0标准里面的
* 属性:autostart="false"
,是否自动开始
* volume音量
* loop次数<video></video>
播放视频html5(对后缀名有一定的要求mp4,wav,au能播放)<marquee></marquee>
滚动- direction目标方向,
direction = "right"
,从左向右跑,默认从右向左跑
- 上下跑,先给个高度
width=,height
,上下跑down
- 上下跑,先给个高度
- behavior行为,跑动的一个方式,三个值
- slide移动一次
- alternate来回移动
- scroll转着圈滚
- scrollamount一次移动的距离,可以加快速度
- loop移动几圈
- scrolldelay移动一下休息一下,单位是ms,移动感觉一顿一顿的
- direction目标方向,
头标签
<html>
我们这个页面是一个html页面
- 属性lang(language),我们所用的语言en英语
<head>
头,提供给服务器
<meta>
键值对提供一些信息
http-equiv = "reflesh"
刷新用的,content = "3;url=http://www......"
3秒后刷新到后面的页面
<title>
页面的标题
<body>
- bgcolor背景颜色
- background背景图片
- text,body里面的文本用什么颜色来显示,默认是黑色(所有文本)
- link超链没有点击之前的颜色
- alink鼠标点上去而没有松开的颜色
- vlink点击完之后的颜色
补充
<label></label>
给文字加上标签提供事件,不改变它的任意本身有的特性