Html(超文本标记语言)

Html(超文本标记语言)

初识Html:

Hyper Text Markup Language

W3C(万维网联盟):结构化标准语言、表现标准语言、行为标准。

网页的基本信息:DOCTYPE head meta


 
<html>
	<head>
		<meta name="keywords" content="别闹java" />
		<meta name="description" content="来这个地方可以学习java" />
		<meta charset="utf-8" />
		<link rel="shortcut icon" href="img/item.jpg" />
		<title>登录title>
	<body>
	body>
html>

网页的基本标签:

标题标签:< h1 > < h1 />

段落标签:< p > < p />

换行标签:< br />

水平线标签:< hr />

字体样式标签:粗体 ,斜体 < strong > < strong /> < em > < em />

特殊符号:空格: ;> 大于;< 小于;© 书名号 ;

图像标签:< img src=“路径” alt=“图像的代替文字” title=“鼠标悬停提示文字” withd=”宽度“ height=”高度“/>

链接标签:

页面跳转:< a href =“path” target =“目标窗口位置” > 链接文本或图像< /a > target=_ blank 在新标签页中打开。target=_ self 在自己的网页中打开

锚链接

1、使用name做为一个标记:< a name=“top” >顶部< a/>

2、< a href =”#top“>回到顶部< a />或者 <ul> <li>li> <li>li>u <li>li> ul>

有序列表:试卷、问答

<ol>
     <li>djklali>
     <li>frsdgli>
     <li>fefsfli>
ol>

自定义列表:公司网站底部

<dl>
    <dt>dt>列表名称
    <dd>dd>列表内容
    <dd>dd>
dl>

表格标签:

<table border="1px">border 边框
    <tr>
    <td colspan="4">td> colspan 跨列
    <td rowspan="4">td>列标签 rowspan 跨行
    tr>行标签
table>

视频和音频

视频元素:video

controls 可以开始/暂停的选项 autoplay 自动播放(打开网页自动播放)

音频元素:audio

controls 可以开始/暂停的选项 autoplay 自动播放(打开网页自动播放)

页面结构分析

导航栏(网页头部)

header :标记头部区域的内容

footer :标记脚部区域的内容

section :web页面中的一块独立区域

article :独立的文章内容

aside :相关内容或应用(常用于侧边栏)

nav :导航类辅助内容

iframe内联框架:

<iframe src="https://www.baidu.com" name="hello" frameborder="0" width="1000px" height="1000px">iframe>
<a href="https://www.baidu.com" target="hello">点击跳转a>

初始表单post和get提交方式

重置。

文本框和单选框

属性 说明
type 指定元素的类型。text(文本框)、password(密码)、checkbox(多选框)、radio(单选框)、submit(提交)、reset(重置)、file(文件)、hidden(隐藏)、image(图片)、button(按钮),默认为text。
name 指定表单元素的名称
value 元素的初始值。type为radio时必须指定一个值
size 指定表单元素的初始宽度。当type为text或password时,表单元素的大小以字符为单位。对于其他单位,宽度以像素为单位。
maxlength type为text或password时,输入的最大字符数
checked type为radio或checkbox时,指定按钮是否被选中

单选框标签

<input type="radio" value="boy" name="sex" checked/>
<input type="radio" value="girl" name="sex"/>

多选框标签:

<input type="checkbox" value="sleep" name="hobby"/>睡觉
<input type="checkbox" value="sport" name="hobby" checked/>睡觉                                       

按钮标签:

<input type="button" name="btn1" value="点击"/>
<input type="image" src="图片地址"/>
<input type="submit" value="提交"/>
<input type="reset" value="清空"/>

下拉框(列表框):

<select name="列表名称">
    <option value="china" selected>中国option>
select>

文本域:

<textarea name="textarea" cols="10" row="10">文本内容textarea>cols:列 row:行

文件域:

<input type="file" name="files">

验证:

<input type="email" name="email"/>
<input type="url" name="url"/>
<input type="number" name="num" max="100" min="0" step="10"/>

滑块:

<input type="range" name="voice" min="0" max="100" step="10"/>

搜索框:

<input type="search" name="search"/>

表单的应用:

隐藏域:hidden
只读:readonly
禁用:disabled
都可以写在表单中。

增强鼠标可用性:

<label for="mark">你点你我试试label>
<input type="text" id="mrak">

表单的初级验证:

placeholder> 提示信息 输入框
<requried>非空判断 输入框
pattern>正则表达式:网上查

你可能感兴趣的:(html)