前端技术——html
html
超文本标记语言 (是标记语言不是文本语言)
本篇主要介绍基本格式与使用方法
https://github.com/StingLon/WEB-/blob/master/%E5%89%8D%E7%AB%AF-html
前端技术的作用:前端开发中HTML用来填写内容,CSS+div是显示页面效果,JS(JQ)用来完成交互行为
1.html结构:
<html>
<head>
<meta charset="UTF-8">
<title>这是我的博客</title> </head> <body> 这是我的身体。 </body> </html>
2.文档声明:
在<html>前,要写文档声明语句: <!DOCTYPE HTML>,当然也可以用小写表示。文档声明的作用是告诉浏览器该文档遵循html规范。
3.添加编码 <meta charset="UTF-8">
4.方法:
(1) 换行<br/>
(2)段落<p> xxx</p>
(3) 标题 <h1>标题1</h1>
<h2>标题1<<h2>
(4)文本格式:
<b>定义粗体文本</b><br />
<i> 定义斜体文本 </i><br />
<del>定义删除文本</del><br />
<sup>定义上标字</sup><br />
<sub>定义下标字</sub><br />
(5)超链接: <a href=“URL”></a>
(6)图像<img src=" "/>
(7)地址书写:
./ 当前目录
../ 回到上一层目录
images/ 进入一层目录
../images/ 回到上一层目录,然后再进入images目录
(8)列表排序:
无序列表用<ul><li> xxx</li></ul>表示
有序列表用<ol><li> xxx</li></ol>表示
(9)表格
<table>
<tr>
<td>
xxx
</td>
</tr>
</table>
(10) <iframe> 内嵌框架 (感觉有用)
<iframe src="http://www.baidu.com" name="baidu" height="600"width="600"></iframe>
(11)form 表单
<form name="form1" action="URL" method="get|post" target="文档显示方式"> 用户名:<input type="text" name="uname" /> 密 码:<input type="password" name="passwd" /> </form>
(a). 文本域:文本域通过<input type="text"> 标签来设定
<input type="text" name="firstname">
(b).单选按钮:radio
<input type="radio" name="sex" value="male">Male
(c). 复选框:checkbox
<input type="checkbox" name="run" value="跑步"> 跑步
(d).隐藏域:
<input type="hidden" name="uid" value="10"/>
(e).多行文本域
<textarea rows="10" cols="30"> xx </textarea>
(f).下拉列表 select
<select name="cars">
<option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat">Fiat</option> <option value="audi">Audi</option> </select>
(g).下拉分组:optgroup 元素用于组合选项
<select name="city" multiple>
<optgroup label="广东"> <option value="1">广州</option> <option value="2">深圳</option> </optgroup> <optgroup label="其他"> <option value="3">长沙</option> </optgroup>
</select>
重置按钮:reset
<
input
type
=
"reset"
value
=
"重置"
>
字体颜色:
<
font
color
=
"red"
size
=
"-2"
>红色小2号字体</
font
>