html基础
简单搭建body /body
中间显示文件内容
基础语句认识
<html> #文件类型显示
<head> #head 表示头部 头部不在文件显示
<title>huling111</title> #title 显示文件文件标题
</head> #头部结尾 结尾必须加根
<body> #文件正文内容显示
天涯何处无芳草<br> #文件正文内容 br 表示下一行 重启一行
<b>何必之恋一枝花 #b 表示加粗文件内容
</body> # 文件显示内容结束
</heml> #整个文件结束
p ¥¥¥ h
<P>
<html>
<body>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
<p>Paragraph elements are defined by the p tag.</p>
</body>
</html>
注释:<p> 代表 段落 和br的区别在于 br 是行 p是段落 p之间的空隙是比较大的
h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
<h4>This is a heading</h4>
<h5>This is a heading</h5>
<h6>This is a heading</h6>
h1 最大 h6最小
注释:<h> #代表标题元素
@@@@@
当需要结束一行,并且不想开始新段落时,使用<br>标签。<br>标签不管放在什么位置,都能够强制换行。## 新的改变换行
### 注释
<!-- This is a comment --> 不会在文本中显示 需要注释的内容必须写在 括号里面
居中
<html>
<body>
<h1 align="center">This is heading 1</h1> #让标题居中 align="center">
<p>The heading above is aligned to the center of this page. The heading above is aligned to the center of this page. The heading above is aligned to the center of this page.</p>
</body>
</html>
文字格式 pre
<html>
<body>
<pre>
This is
preformatted text.
It preserves both spaces
and line breaks.
</pre> #pre 表示 下面的会按照 你所编辑的内容 来走
<p>The pre tag is good for displaying computer code:</p>
<pre>
for i = 1 to 10
print i
next i
</pre>
</body>
</html>
###### **
删除和增加内容
<html>
<body>
<p>
a dozen is
<del>twenty </del> #删除内容
<ins>twelve </ins> #增加内容
pieces
</p>
<p>
Most browsers will overstrike deleted text and underline inserted text.
</p>
<p>
Some older browsers will display deleted or inserted text as plain text.
</p>
</body>
</html>
实体 特殊符号添加
<html>
<body>
<p>This is a character entity: {</p>
<p>
</body>
</html>
添加链接
<html>
<body>
<p>
<a href="lastpage.htm">
This text</a> is a link to a page on this Web site.
</p>
<p>
<a href="http://www.microsoft.com/"> #连接可以打开
This text</a> is a link to a page on the World Wide Web.
</p>
</body>
</html>
插入图片连接
<html>
<body>
<p>
You can also use an image as a link:
<a href="http://www.baidu.com"> # 点击图片后的连接 连接前面一定要带协议
<img border="0" src="1.png"> #1.png 属于本地图片名字
</a>
</p>
</body>
</html>
文字 连接网址
<html>
<body>
<a href="http://www.baidu.com" target="_blank">Last Page</a> #点击文字 直接到百度
<p>
If you set the target attribute of a link to "_blank",
the link will open in a new window.
</p>
</body>
</html>
水平分栏
<html>
<frameset rows="25%,50%,25%"> #分栏
<frame src="1.png"> #第一个栏 添加本地图片
<frame src="2.jpg"> #第二个蓝 添加本地图片
<frame src="3.jpg"> #3个 添加本地图片
</frameset>
</html>
竖直分栏
<html>
<frameset cols="25%,50%,25%">
<frame src="frame_a.htm">
<frame src="frame_b.htm">
<frame src="frame_c.htm">
</frameset>
</html
水平竖直分栏
<html>
<frameset rows="50%,50%"> #水平分栏
<frame src="frame_a.htm">
<frameset cols="25%,75%"> #竖直分栏
<frame src="frame_b.htm">
<frame src="frame_c.htm">
</frameset>
</frameset>
</html>
行里面加列
<html>
<body>
<h4>With a normal border:</h4>
<table border="15">
<tr>
<td>row 1, cell 1</td> 第一行 第一列
<td>row 1, cell 2</td> 第二行 第二列
<td>row 1, cell 1</td>
</tr>
<tr>
<td>row 2, cell 1</td> 第一行 第1列
<td>row 2, cell 2</td> 第二行 第二列
<td>row 2, cell 2</td>
</tr>
</table>
</body>
</html>
作者:不是一般黑
vx:292771751