html常用的知识点以及混合框架

最新推荐文章于 2021-06-04 18:11:28 发布

辛苦的码农20200609

最新推荐文章于 2021-06-04 18:11:28 发布

阅读量321

点赞数

分类专栏：前端

原文链接：https://www.mk2048.com/blog/blog_h20k0a2ai1aa.html

版权

前端专栏收录该内容

785 篇文章 4 订阅

订阅专栏

html中：

<hr/> 在页面中创建水平线

例如：

<p> p标签是定义段落

alt 作为可预备可替换信息，在无法加载图片时显示文字信息

定义html表格

<table>	定义表格
<caption>	定义表格标题。
<th>	定义表格的表头。
<tr>	定义表格的行。
<td>	定义表格单元。
<thead>	定义表格的页眉。
<tbody>	定义表格的主体。
<tfoot>	定义表格的页脚。
<col>	定义用于表格列的属性。
<colgroup>	定义表格列的组。

Table with frame="box":四周边框

Month	Savings
January	$100

Table with frame="above":上边框线

Month	Savings
January	$100

Table with frame="below":下边框线

Month	Savings
January	$100

Table with frame="hsides":上下边框线

Month	Savings
January	$100

Table with frame="vsides":左右边框线

Month	Savings
January	$100

使用 HTML5 的网站布局

header	定义文档或节的页眉
nav	定义导航链接的容器
section	定义文档中的节
article	定义独立的自包含文章
aside	定义内容之外的内容（比如侧栏）
footer	定义文档或节的页脚
details	定义额外的细节
summary	定义 details 元素的标题

HTML框架

<html>

</frameset>

</html>

<html>

<body>您的浏览器无法处理框架！</body>

</noframes>

</frameset>

</html>

混合框架结构

<html>

noresize="noresize"

<frame src="/example/html/frame_c.html"> 加入noresize="noresize"框架不可移动改变大小

</frameset>

</html>

导航框架

<html>

</frameset>

</html>

内联框架

<html>

<body>

<p>一些老的浏览器不支持 iframe。</p>

<p>如果得不到支持，iframe 是不可见的。</p>

</body>

</html>

内联框架iframe

添加 iframe 的语法

URLIframe - 设置高度和宽度

实例

Iframe - 删除边框

实例

<!DOCTYPE html>

<html>

<body>

<p><a href="http://www.w3school.com.cn" target="iframe_a">W3School.com.cn</a></p>

<p><b>注释：</b>由于链接的目标匹配 iframe 的名称，所以链接会在 iframe 中打开。</p>

</body>

<noscript> 标签

Your browser does not support JavaScript!

HTML实体名

HTML 中有用的字符实体

注释：

显示结果	描述	实体名称	实体编号
	空格
<	小于号	<	<
>	大于号	>	>
&	和号	&	&
"	引号	"	"
'	撇号	' (IE不支持)	'
￠	分（cent）	¢	¢
£	镑（pound）	£	£
¥	元（yen）	¥	¥
€	欧元（euro）	€	€
§	小节	§	§
©	版权（copyright）	©	©
®	注册商标	®	®
™	商标	™	™
×	乘号	×	×
÷

html中颜色名

http://www.w3school.com.cn/html/html_colornames.asp

HTML5 表单元素

HTML5 <datalist> 元素

listid 实例

<input type="password">密码字段

输入限制

属性	描述
disabled	规定输入字段应该被禁用。
max	规定输入字段的最大值。
maxlength	规定输入字段的最大字符数。
min	规定输入字段的最小值。
pattern	规定通过其检查输入值的正则表达式。
readonly	规定输入字段为只读（无法修改）。
required	规定输入字段是必需的（必需填写）。
size	规定输入字段的宽度（以字符计）。
step	规定输入字段的合法数字间隔。
value	规定输入字段的默认值。

type=date

Birthday:

</form>

可以输入添加限制

Enter a date before 1980-01-01:<br>

Enter a date after 2000-01-01:<br>

</form>

常见的输入

输入类型：range

<input type="range">实例

亲自试一试

输入类型：month

<input type="month">实例

<form> Birthday (month and year): <input type="month" name="bdaymonth"> </form>

亲自试一试

输入类型：week

<input type="week">实例

<form> Select a week: <input type="week" name="week_year"> </form>

亲自试一试

输入类型：time

<input type="time">实例

<form> Select a time: <input type="time" name="usr_time"> </form>

亲自试一试

输入类型：datetime

<input type="datetime">实例

<form> Birthday (date and time): <input type="datetime" name="bdaytime"> </form>

亲自试一试

输入类型：datetime-local

<input type="datetime-local">实例

<form> Birthday (date and time): <input type="datetime-local" name="bdaytime"> </form>

亲自试一试

输入类型：email

<input type="email">实例

亲自试一试

输入类型：search

<input type="search">实例

<form> Search Google: <input type="search" name="googlesearch"> </form>

亲自试一试

输入类型：tel

<input type="tel">实例

<form> Telephone: <input type="tel" name="usrtel"> </form>

亲自试一试

输入类型：url

<input type="url">实例

<form> Add your homepage: <input type="url" name="homepage"> </form>

readonly 属性

readonly

disabled 属性

disabled

maxlength 属性

maxlength实例

autocomplete 属性

autofocus 属性页面加载自动获得焦点

form 属性

实例

formaction 属性

实例

height 和 width 属性仅用于 <input type="image">。

实例

亲自试一试

multiple 属性

实例

pattern 属性

国家代码：<input type="text" name="country_code" pattern="[A-z]{3}"

title="三个字母的国家代码" />

</form>

placeholder 属性

实例

亲自试一试

required 属性

step 属性

示例

亲自试一试

HTML5 浏览器支持

辛苦的码农20200609

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
html常用的知识点以及混合框架

html中：<hr/> 在页面中创建水平线例如：<p> p标签是定义段落>alt 作为可预备可替换信息，在无法加载图片时显示文字信息定义html表格<table>定义表格<caption>定义表格标题。<th>定义表格的表头。<tr>定义表格的行。<td>定义表格单元。<thead>定义表格的页眉。<tbody>定义表格的主体。<...
复制链接

扫一扫