大家好，欢迎来到IT知识分享网。
>>>HTML5<<<
文本编辑器即可编辑。其基本结构如下：
<!DOCTYPE html> <!–命名文档内容–>
<html> <!–说明我们写的是html文档–>
<head> <!–文档头部(描述区)–>
<meta charset=”utf-8″> <!–编码格式–>
<title>标题</title> <!–网页标题–>
</head>
<body> <!–网页主体–>
显示在页面的主体内容
</body>
</html>
一. 前言:
>> html的标记语法
1. 常规标记:
<标记名称 属性1名=”属性1值” 属性2名=”属性2值”……></标记名>
2. 空标记:
<标记名 属性1名=”属性1值”/>
>> 说明:
1. 尖角号<>里的第一个单词,叫做标记,或标签,也称元素.
2. 标记和属性用空格隔开,属性与属性值用等号连接,属性值必须放双引号内.
3. 一个标记可以有多个属性,属性与属性之间用空格隔开,*属性不分前后顺序*
4. 空标记是指没有结束标签的标记,必须以”/”关闭,例如:<hr/>
二. 常用标签
1. <h1>标题标签</h1>
一般为<h1>~<h6>, <h1>标签一般一个网页中只使用一次, 其他的可以使用多次
2. 字体标记
(1). <p>…</p>
段落标签
两个<p>标签之间会有一个空行,来区分段落
(2). <i>…</i>
字体倾斜标签
(3). <em>…</em>
字体倾斜标签,与上面的<i>标签效果一致
(4). <b>…</b> | <strong>…</strong>
两个标签效果一样.
(5). <u>…</u>
设置文本加下划线
3. 空标签:
(1). <br />
换行标签,换行
(2). <hr />
水平线标签
4. 字符实体 (转义字符):
常用:
不换行空格
> >右尖括号
< <左尖括号
© 备案中图标
5. 列表标签:
html中包含了三种列表,分别是: 无序列表,有序列表,自定义列表.
(1). 无序列表
<ul> <!–父级标签–>
<li></li> <!–子标签–>
</ul>
(2). 有序列表
<ol> <!–其属性 type=”a” 或者 “A” 可以使有序列表的序号别为大小写英文序号, 还可以为”i”或”I” 序号就会变为罗马数字–>
<!–他还有一个属性 start =”2″, 就是序号从2开始计数–>
<li></li>
</ol>
(3). 自定义标签
<dl>
<dt>名词</dt>
<dd>解释</dd> <!–定义描述–>
</dl>
6. 链接和图像
(1). 链接
<a href=”目标文件路径及全称或者链接地址” title=”提示文本”> 链接文本或图片</a>
其中 href 属性不能为空,可用 href=”#”, 或者 href=”javascript: ;” 来表示空标签
另一个属性 target=”_blank”,在新开页面打开网页.
(2). 插入图片
<img src=”图片路径” border=”边框” alt=”图片替换文本” title=”图片标题” width=”宽度” height=”高度” />
属性 alt 只有在文件失效的时候才会显示
>>>绝对路径和相对路径
绝对路径: 网站域名/images/img01.jpg <!–即详细的文件路径–>
相对路径: images/img01.jpg (同级)当当前文件与目标文件在同一目录下,直接写文件名+扩展名
(上级找下级)当当前文件与与目标文件所处的文件夹在同一目录下,写法如下: 文件夹名/目标文件全称+扩展名
(下级找上级)当当前文件所处的文件夹和目标文件在同一目录下, 写法如下: ../目标文件文件名+扩展名 <!– ../表示向上一级–>
三. 常用元素
(布局标签)
1. <div>…</div>
块标签,用来设定文档区域, 每一个</div>标签后面都会另起一行
2. <span>…</span>
文本节点标签,可以是某一小段文本,即给一段文本分成节点,从而去控制某一段文本的样式
四. 表格属性
<table> <!–表格主体标签–>
<tr> <!–行标签–>
<td></td> <!–表列标签–>
<td></td>
</tr>
</table>
属性:写在<table>标签内
1. width=”400″ height=”600″ 宽度和高度
2. border=”1″ 表格线宽,1像素
3. bordercolor=”#000000″ 表格线条颜色
4. cellspacing=”2″ 单元格与单元格之间的间距为2像素
5. cellpadding=”10″ 单元格与内容之间的距离
6. align=”center” 表格水平对齐方式(与浏览器),当写到<tr>上,就是行的水平对其方式
valign=”top” 垂直对齐方式
7. colspan=”2″ 合并单元格列数,合并的数目为2
rowspan=”2″ 合并单元格行数,合并的数目为2
五. 表单
表单用来收集用户的信息
1. 表单框
<form name=”表单名称” method=”get/post” action=”路径”>…</form>
2. 表单控件
<input type=”” />
input: 表单类型标记(标签)
表单控件的属性有:
name: 属性标识表单域的名称
type: 属性标识表单控件的类型,大概十几种,大致有:
ps:文本框(text) , 密码框(password) , 提交按钮(submit) , 重置按钮(reset) , 空按钮(button) , 单选框(radio) , 复选框(checkbox)
maxlength: 控制最多输入的字符数
size: 控制框的宽度(以字符为单位)
3. 下拉菜单
<select>
<option>下拉选项1</option>
<option>下拉选项2</option>
</select>
4. 表单域多行文本定义
<textarea name=”” cols=”” rows=”” >…</textarea>
其中 cols 和 rows 属性是定义表单域的高度和宽度,单位是字符,阻止其拖动可以利用css设置 style=”resize;none;”
免责声明：本站所有文章内容,图片，视频等均是来源于用户投稿和互联网及文摘转载整编而成，不代表本站观点，不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益，请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权，请联系删除，如若转载，请注明出处：https://haidsoft.com/133631.html
