<!--打印Hello HTML-->
<html>
<body>
<p>Hello HTML</p>
</body>
</html>
中文乱码问题
<!--中文乱码问题
可以在浏览器上设置编码方式为GB2312
或者在html的最前面加上编码设置
这样就能告诉浏览器使用GB2312方式显示中文
如果 GB2312不行,就用UTF-8-- >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312">
</head>
<p>中文</p>
水平线<hr/>,标题大小,换行<br/>
<h1>标题1</h1>
<br/>
<br/>
<br/>
<!h1h2,h3代表不同大小的标题>
<h1>标题2前面有3个换行</h1>
<p>这是一个水平线,有渲染效果,但是没有文本内容</p>
<hr/>
设置居中标题
<h1 >未设置居中的标题</h1>
<h1 align="center">居中标题</h1>
设置注释
<!--align属性用于对齐-->
<h1 align="center">居中标题</h1>
粗体效果
<p>无粗体效果</p>
<b>b标签粗体效果</b>
<br/>
<!--一般用strong-->
<strong>strong标签粗体效果</strong>
斜体效果
<p>无斜体效果</p>
<i>使用 i 标签带来的斜体效果</i>
<br/>
<em>使用 em 标签带来的斜体效果</em>
<strong><i>同时有粗体和斜体</i></strong>
有时候,需要在网页上显示代码,比如java代码就需要用到pre
<p>这里是没有用预格式的情况:</p>
public class HelloWorld {
public static void main(String[] args) {
System.out.println("Hello World");
}
}
<br/>
<br/>
<p>使用预格式的情况:</p>
<pre>
public class HelloWorld {
public static void main(String[] args) {
System.out.println("Hello World");
}
}
</pre>
删除标签
<p>无删除效果</p>
<del>使用del标签实现的删除效果</del>
<br/>
<s>使用s标签实现的删除效果,但是不建议使用,因为很多浏览器不支持s标签</s>
下划线的标签
<ins>使用ins标签实现的下划线效果</ins>
<br/>
<u>使用u标签实现的下划线效果,但是不建议使用</u>
图像显示
<img src="https://how2j.cn/example.gif"/>
<!--src="文件路径"-->
<img src="example.gif"/>
<!--src="文件名"。如果是本地文件,只需把图片放在同一个目录下即可
src直接使用文件名,不需要/ -->
<img src="example.gif"/>
<img src="https://how2j.cn/example.gif"/>
<!--src="文件路径"-->
<img src="https://how2j.cn/example.gif"/>
<img src="../example ">
<!--src="src使用图片所在的绝对路径,并在前面加上file:// ">
<img src="file://c:example.gif"/>
<!-- 如果是本地文件,只需把图片放在同一个目录下即可
src直接使用文件名,不需要/ -->
<img width="200" height="200" src="https://how2j.cn/example.gif"/>
<div align="left">
<!--居左-->
<img src="https://how2j.cn/example.gif"/>
</div>
<div align="center">
<!--居中-->
<img src="https://how2j.cn/example.gif"/>
</div>
<div align="right">
<img src="https://how2j.cn/example.gif"/>
</div>
<!--如果图片不存在,默认会显示一个缺失图片,这是不友好的
所以可以加上alt属性。
当图片存在的时候,alt是不会显示的
当图片不存在的时候,alt就会出现 -->
<img src="https://how2j.cn/example_not_exist.gif" />
<br/>
<img src="https://how2j.cn/example.gif" alt="这个是一个图片" />
<br/>
<img src="https://how2j.cn/example_not_exist.gif" alt="这个是一个图片" />