HTML代码示例.docx
- 文档编号:6094590
- 上传时间:2023-01-03
- 格式:DOCX
- 页数:43
- 大小:24.82KB
HTML代码示例.docx
《HTML代码示例.docx》由会员分享,可在线阅读,更多相关《HTML代码示例.docx(43页珍藏版)》请在冰豆网上搜索。
HTML代码示例
HTML代码示例
目录
HTML代码示例1
目录1
HTML文本格式示例3
一个非常简单的HTML文件3
HTML简单段落3
在HTML写多个段落4
在HTML里如何换行5
HTML正文标题5
HTML居中显示的标题6
在HTML文件里加一条横线(horizontalrule)6
HTML文件的代码注释7
HTML常用格式Tag8
HTML预格式文本(preformattedtext)9
HTML不同计算机输出的Tag10
HTML里加入地址11
HTML里表示删除插入的Tag11
HTML超链接示例12
如何创建HTML超链接(hyperlinks)12
将图片作为一个超链接13
在HTML文件里跳转13
在新窗口打开一个链接16
链接到一个邮箱地址17
HTML表格(Table)示例18
HTML简单表格18
没有边界的表格20
有边界的表格21
HTML表格的表头23
表格空单元格25
带标题的表格27
包含多行或多列的表格单元格28
一个表格单元格里的内容29
表格的单元格内容和单元格边界之间的距离(CellPadding)31
表格中单元格之间的距离(Cellspacing)33
给表格加背景颜色或者背景图片35
表格单元格对齐方式(align)36
表格的单元格背景颜色和背景图片38
HTML框架(Frame)示例39
列分的框架(Frame,cols)39
行分的框架(Frame,rows)39
既有行分又有列分的框架(Frame,rows,cols)40
用框架(Frame)导航40
使用内嵌框架(IFrame)41
如何固定框架(Frame)大小41
HTML列表(List)示例42
不排序列表(UnorderedList)42
排序列表(orderedlist)42
不排序列表的类型(Type)设置43
嵌套的列表(nestedlist)44
定义列表(definitionlist)45
HTML不同类型(Type)的排序列表46
HTML表单(Form)示例48
HTML表单控件-单行文本输入框48
HTML表单控件-密码输入框48
HTML表单控件-复选框(checkbox)49
HTML表单控件-复选框(checkbox)缺省已选(checked)50
HTML表单控件-单选框(radio)50
HTML表单控件-单选框(radio)缺省已选(checked)51
HTML表单控件(FormControl)-下拉框(select)单选52
HTML表单控件-下拉框(select)多选(multiple)52
HTML表单控件-下拉框多选-下拉框设置(size)53
HTML表单控件-多行输入框(textarea)54
HTML表单控件-图片提交(inputtype=image)55
HTML图片(Image)示例55
在HTML里插入图片55
HTML里图片的对齐方式(Align)56
HTML的图片大小(Height,Width)56
HTML图片的说明(Alt属性)57
HTML字体(font)示例57
HTML字体大小(fontsize)57
HTML字体颜色(fontcolor)58
HTML字体风格(fontface)58
HTML网页背景颜色和背景图片示例59
HTML背景颜色59
HTML里加背景图片59
HTML头部信息(Head)示例60
利用Meta的Refresh自动跳转到指定页面60
HTML文本格式示例
一个非常简单的HTML文件
这是一个非常简单的HTML。
HTML简单段落
这是第一段。
这是第二段。
这是第三段。
在HTML里,用p来定义段落。
在HTML写多个段落
这一段
在源代码里
包含很多分行,
但是浏览器忽略
这些分行。
这一段在浏览器里
包含很多空格,
但是浏览器忽略多余空格。
你使用的浏览器的窗口大小决定了段落的行数。
如果你改编浏览器窗口的大小,段落的行数会因此改变。
在HTML里如何换行
要
在一段
里
换行
请使用
br这个Tag。
HTML正文标题
这是1号标题
这是2号标题
这是3号标题
这是4号标题
这是5号标题
这是6号标题
HTML居中显示的标题
上面的标题是居中显示的。
在HTML文件里加一条横线(horizontalrule)
用hr这个Tag可以在HTML文件里加一条横线。
村妇想像皇宫的生活:
皇后得用金扁担挑水吧。
问:
谁是世界上最可怜的人?
答:
炮兵连炊事班战士!
问:
为什么?
答:
戴绿帽背黑锅看别人打炮。
初中某数学老师讲方程式变换,在讲台上袖子一挽大声喝道:
同学们注意!
我要变形了!
……
HTML文件的代码注释
--这是代码注释-->
代码注释是不会显示在网页里的。
HTML常用格式Tag
粗体用b表示。
斜体用i表示。
芙蓉姐姐这个词当中划线表示删除。
想唱就唱这个词下划线插入。
X2其中的2是下标
X2其中的2是上标
好好学习,天天向上。这句话缩进表示引用
这是
预设(preformatted)文本.
在pre这个tag里的文本保留
空格和
分行。
callgetOrders
用code显示计算机代码,code里显示的字符是等宽字符。
HTML预格式文本(preformattedtext)
这是预格式(preformatted)
文本
浏览器会保留pre里面的空格和分行。
pre用来表示计算机代码,效果很好。
看如下代码显示:
fori=1to10
printi
nexti
HTML不同计算机输出的Tag
计算机代码Computercode
键盘键入Keyboardinput
电报文本Teletypetext
示例文本Sampletext
计算机变量Computervariable
注:
以上这些Tag都可以用来显示计算机程序代码。
HTML里加入地址
上海站长网站长学院路1000号
站长网站长学院大楼101室
邮编:
200000
HTML里表示删除插入的Tag
我要
删除
插入
文字。
还可以使用strike表示删除,效果和del一样。
但是HTML国际标准推荐使用del,不再建议使用strike。
HTML超链接示例
如何创建HTML超链接(hyperlinks)
将图片作为一个超链接
你可以将一张图片作为一个链接,点击这个图片。
在HTML文件里跳转
参见第六章
第1章
这是站长网站长学院网页教程与代码的中文站点。
第2章
这是站长网站长学院网页教程与代码的中文站点。
第3章
这是站长网站长学院网页教程与代码的中文站点。
第4章
这是站长网站长学院网页教程与代码的中文站点。
第5章
这是站长网站长学院网页教程与代码的中文站点。
第6章
这是站长网站长学院网页教程与代码的中文站点。
第7章
这是站长网站长学院网页教程与代码的中文站点。
第8章
这是站长网站长学院网页教程与代码的中文站点。
第9章
这是站长网站长学院网页教程与代码的中文站点。
第10章
这是站长网站长学院网页教程与代码的中文站点。
第11章
这是站长网站长学院网页教程与代码的中文站点。
第12章
这是站长网站长学院网页教程与代码的中文站点。
第13章
这是站长网站长学院网页教程与代码的中文站点。
第14章
这是站长网站长学院网页教程与代码的中文站点。
第15章
这是站长网站长学院网页教程与代码的中文站点。
第16章
这是站长网站长学院网页教程与代码的中文站点。
第17章
这是站长网站长学院网页教程与代码的中文站点。
在新窗口打开一个链接
如果你将target的属性值设成_blank,你点击这个链接的时候,网页就会在一个新窗口出现。
链接到一个邮箱地址
这是一个最简单的邮箱地址的链接:
info@">给新浪网站发信
这个邮箱地址的链接写了subject内容:
info@? subject=Hello">给新浪网站发信
这个邮箱地址链接写了to,cc,bcc,subject,body的内容:
info@? cc=webmaster@&bcc=media@&subject=I%20like%20your%20site&body=真是个好站点! ">写信给新浪
注:
空格请用%20表示。
HTML表格(Table)示例
HTML简单表格
表格所用到的Tag:
整个表格开始要用table;每一行开始要用tr;每一单元格开始要用td。
只有一行(Row)一列(Column)的表格
一行三列的表格
两行三列的表格
没有边界的表格
缺省情况下,表格没有边界。
100 | 200 | 300 |
400 | 500 | 600 |
表格Border设为0,也不显示边界:
有边界的表格
表格的边界值设为1:
表格的边界值设为8,边界更粗:
表格的边界值设为15,边界更粗:
HTML表格的表头
有表头的表格:
竖直方向的表头:
表格空单元格
上面的表格中,有一个单元格里是没有任何内容的,这个空的单元格没有显示边界,虽然整个表格设了边界值。
上面的例子,你可以看到,给这个单元格加上一个空格符号之后,单元格的边界就显示出来了。
注意:
空格符要用&bsp;表示。
是一个HTML特别字符,参见HTML特别字符(HTMLCharacterEntities)。
带标题的表格
这个表格有标题:
包含多行或多列的表格单元格
用colpsan属性,设置包含多列的单元格:
用rowspan这个属性,设置包含多行的单元格:
一个表格单元格里的内容
这是一段
这是另外一段。
表格的单元格内容和单元格边界之间的距离(CellPadding)
没有cellpadding的表格:
设置cellpadding属性,可以改变单元格内容和单元格边界之间的距离。
以下是设置了cellpadding属性的表格:
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- HTML 代码 示例
copyright@ 2008-2022 冰点文档网站版权所有
经营许可证编号:鄂ICP备2022015515号-1