HTML简介(笔记)

1.HTML技术
1.1 HTML简介
它是一门描述网页的语言,全称(HyperText MarkUp Language)超文本标记语言。
超文本:超出文本的范畴,指的是在网页上面可以描述文本、图片、视频等内容
标记:标签,在标签里面书写内容。
语言:html就是用户和浏览器交互的工具。简单来讲,浏览器会解析html的标记,以特定的效果展示出来。
1.2 html的主要组成部分:
文档的声明<!DOCTYPE>:声明了html的类型和版本号。
html的根标记<html></html>:标识了html的开始和结束。
html的头部标记<head></head>:设置与页面相关的信息。
html的主题标记<body></body>:在页面展示内容。
1.3
1.段落标记<p></p>和换行标记<br />
注意:<p>标签会在开始自动换行,他是基于本行前面有内容的情况,如果已经是开头或者当前行的最前面,是不会再次换行的
2.文本样式标记<font>内容</font>
常用的属性:face 用来描述字体的样式
size用来描述字体的大小,最大取值为7
color用来描述字体的颜色,取值三种形式:
a.用英文单词标识 b.用16进制数据表示:#ff0000
c.用rgb(255,255,0)来表示
3.图像标记
(1)定义:在网页上引入图片
(2)语法:<img src="图像的url" />
(3)常用的属性:src 用来引入图片
width 描述图片的宽度
height 描述图片的高度
border 描述图片的边框
注释标记的用法<!--图片-->
5.表格标记
(1)作用:使表格更加的有条理显示出来,用来规划网页。
(2) <table>
<tr>
<td>单元格的内容</td>
</tr>
</table>
<table></table>用于定义一个表格.
<tr></tr>用于定义表格中的行.

  • align用来描述表格内的内容显示的位置。
    align=”center” align=”right” align=”left”
    <td></td>用于定义表格中的单元格(列),必须嵌套在<tr></tr>标记中。
    <th></th>表示单元格,自动居中,加粗。

常用的属性:
border:给表格加边框。
width:描述表格的宽度。
align:描述表格的位置。
cellspacing:描述边框的宽度。
cellpadding:描述边框与文字的距离。
例:<table border="2" width="200" align='center' cellpadding="2" cellspacing="6">
6.表单控件
表单简介:把用户输入的数据提交到服务器端,简单来说,表达用来让用户输入数据,表单把数据封装起来,提交到后台的服务器。
表单的组成:(一共有三部分)
a.表单控件:用户输入数据,比如说输入用户名,输入密码。
b.提示信息:告诉用户输入框要输入什么值。
c.表单域:标识表单的开始和结束,语法为:<form>提示信息:表单控件</form>
1.创建表单
例如:<form action=''htmlDemo01.html''method=''post'' name=''登录表单''>
用户名:<input type=''text'' name=''username'' /><br />
密码:<input type=''password'' name=''psw'' /><br />
<input type=''submit'' value=''提交'' />
</form>
常用的属性:action:表单要提交的位置
method:表单提交的方式,常用的有get提交和post提交,默认情况下是get提交。
get和post提交的区别:
a.get提交:数据会显示在浏览器的地址栏,不安全,提交的数据大小是有限制的。
b.post提交:数据不会显示在浏览器的地址栏,安全,提交的数据大小是没有限制的。
2.表单控件:<input />
输入框控件的属性type:
文本框:text
密码框:password
单选按钮:radio
复选按钮:CheckBox
上传按钮:file
提交按钮:submit
重置按钮:reset
注意:表单想要把数据提交到指定的位置,输入框必须要有name属性。
比如:
评论:<br />
<form method=''get'' action=''htmlDemo01.html>
<textarea rows=''5'' cols=''50'' name=''pinglun''>输入评论,请注意文明用语!</textarea><br />
<input type=''submit'' value"提交评论" />
</form>

猜你喜欢

转载自blog.51cto.com/14572091/2482250