欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

有意思的HTML

程序员文章站 2022-04-06 23:37:30
...

1.HTML文档的基本结构

<!DOCTYPE >        
<html>
    <head>
</head>
    <body>
</body>
</html>

2.简单总结主要元素的功能及属性

(1)<html></html> 定义HTML文档
(2)<head></head> 定义关于文档的信息
子元素:<title></title> 定义文档的标题
属性: dir 规定元素中内容的文本方向
lang 规定元素中内容的语言代码
<base.../ > 为页面上的所有链接规定默认地址或默认目标
属性: href 规定页面中所有相对链接的基准 URL。
target 在何处打开页面中所有的链接。
<meta /> 可提供有关页面的元信息
属性: name 把 content 属性关联到一个名称。
content 定义与 http-equiv 或 name 属性相关的元信息
http-equiv 把 content 属性关联到 HTTP 头部。
scheme 定义用于翻译 content 属性值的格式
<style> 标签用于为 HTML 文档定义样式信息。
属性: type 规定样式表的 MIME 类型。
media 为样式表规定不同的媒介类型。
(3)<body></body> 定义文档的主体。
子元素:<img> 向网页中嵌入一幅图像。
属性:src 规定显示图像的 URL。
alt 规定图像的替代文本。
width 设置图像的宽度
height 定义图像的高度。
<p> 标签定义段落。
<h1> - <h6> 标签可定义标题
<ol> 标签定义有序列表。
属性:type 规定在列表中使用的标记类型。
start 规定有序列表的起始值。
<a> 标签定义超链接,用于从一张页面链接到另一张页面。
属性:href 规定链接指向的页面的 URL。
target 规定在何处打开链接文档。
type 规定被链接文档的的 MIME 类型。
download 规定被下载的超链接目标。
<table> 标签定义 HTML 表格。
属性:border 规定表格边框的宽度。
frame 规定外侧边框的哪个部分是可见的。
rules 规定内侧边框的哪个部分是可见的。
width 规定表格的宽度。
<caption >元素定义表格标题。
<tr> 标签定义 HTML 表格中的行。
<th> 定义表格内的表头单元格。
属性:colspan 设置单元格可横跨的列数。
rowspan 规定单元格可横跨的行数。
char 规定根据哪个字符来进行内容的对齐。
<td> 定义 HTML 表格中的标准单元格。
属性:colspan 设置单元格可横跨的列数。
rowspan 规定单元格可横跨的行数。
char 规定根据哪个字符来进行内容的对齐。
3.做一个简单的HTML
代码:

<!DOCTYPE html>
<html>
   <head>
    <meta charset = "GB2312">
    <title>我的第一个页面</title>
   </head>
   <body>
     <!--我的第一个页面主要包括我喜欢的两个歌手以及他们的介绍 -->
     <h1> 我的第一个页面</h1>
     <h2>我喜欢的歌手1</h2>
     <p> <img src="../img/dengziqi.jpg" alt="写真1" width="200" height="200"/>&nbsp;&nbsp;&nbsp;&nbsp
	     <img src="../img/dengziqi1.jpg" alt="写真2" width="200" height="200"/><br/>
        &lt  邓紫棋,1991年8月16日生于中国上海 ,4岁移居香港,中国香港女歌手,词曲创作人。 &gt<br/>
	    主要作品;&lt &nbsp  泡沫 &nbsp &gt &lt&nbsp  喜欢你 &nbsp &gt 
	 </p>
	 <hr/>
	 <h2 >我喜欢的歌手2</h2>
	 <p> <img src ="../img/zhangliangying.jpg " alt ="写真1" width ="30%" height ="40%"/>&nbsp;&nbsp;&nbsp;&nbsp
	     <img src ="../img/zhangliangying1.jpg " alt ="写真2" width ="30%" height ="30%"/><br/>
        &lt 张靓颖,出生于四川成都,毕业于四川大学外国语学院,中国内地女歌手,现任中华全国青年联合会委员。&gt <br/>
        主要作品;&lt &nbsp 画心 &nbsp &gt &lt &nbsp 如果这就是爱情 &nbsp &gt 
	 </p>
   </body>
</html>

效果图:
有意思的HTML
有意思的HTML
总结:
HTML是一个非常有意思的工具,有兴趣的可以来学习。

推荐:https://www.w3school.com.cn/
有意思的HTML