2.1 文字与段落排版
2.1.1 段落标签
<p></p>
align:设置段落对齐标签 center居中 right 右对齐 left 左对齐 默认左对齐
2.1.2 标题标签
<h1></h1>到<h6></h6>根据重要程度选择，一级最大默认加租
<h? align="center|right|left"></h?>内可以使用段落对齐标签
2.1.3 换行标签
<br></br>
2.1.4 水平线标签
<hr></hr>
<hr size="5" color="#ff3333">设置水平线宽度与颜色
2.1.5 预格式化标签
<pre>你好
大聪明</pre> 如果是在pre标签那一行那么就以与pre间隔多少来算空格，如果不是则以字体前面空格为主
2.1.6 缩排标签
<blockquote>9月13日下午，华南师范大学宣传部的一名工作人员告诉潇湘晨报记者，目前没有收到唐尚珺室友申请调换宿舍的消息。“学生宿舍调整属于学院内部学生管理的事情。如果没有特殊事项不会报给宣传部。已经关注到网上的相关言论，之后会与相关部门保持联系。”
该工作人员表示，唐尚珺只是华南师范大学一个普通的学生，对于他在学校里面的教学、宿舍管理都要遵循学校相关</blockquote>
快引用标签默认有一个边框把内容框住前后都空几格
2.1.7 案例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1 align="center">100%正品 十重保障</h1>
<hr size="5" color="#00ff00"/>
<pre>
全球汇成立于2008年,10年来,凭借独创的特卖模式,精选全球正品好货,深度折扣,在
电子商务研究中心2018年6月发布的“2017年度中国网络零售市场数据监测报告
”中,全球汇在B2C市场交易份额方面发展势头良好,继续保持第三位。
唯品会是全球最大的特卖电商,以及中国第三大电商。
全球汇承诺:
全球布局 直采全世界好货。全球直采:货源保障，
独立自理仓库 坚持入仓全检验。入仓全检:质检保障，
自营物流:物流保障，自营物流封闭操作 全程可溯。
假货必赔:第三方保障，中国人保正品保险，假货必赔。
</pre>
</body>
</html>
2.2 超链接
2.1.1 超链接简介
超链接是一种允许我们同其他网页或站点之间进行连接的元素
2.1.1.1 超链接的定义
<a href="http://www.baidu.com">百度一下</a>
<a href="register.html">注册</a>
<a href="login.html">登录</a>
2.1.1.2 超链接的分类
2.1.1.3 路径
2.2.2 超链接的应用
超链接是一种允许我们同其他网页或站点之间进行连接的元素
2.2.2.1 锚点标签<a>···</a >
2.2.2.2 指向其他页面的超链接
<a href="http://www.baidu.com">百度一下</a>
2.2.2.3 指向书签的超链接
定义书签给他打上标记<a name="p"></a>
然后指向书签<a href="#p">转到第一行</a>指向书签需要加一个#然后再接书签名
2.2.2.4 指向下载文件的超链接
<a href="https://ys-api.mihoyo.com/event/download_porter/link/ys_cn/official/pc_backup53">元神下载</a>
2.2.2.5 指向电子邮件的超链接
<a href="mailto:3197254769.@qq.com">联系我</a>
2.3 图像
2.3.1 网页图像的格式及使用要点
2.3.1.1 常见的网页图像格式
JPEG,PNG,SVG,GIF,WEBP
2.3.1.2 使用网页图像的要点
尽量使用小图，
路径使用相对路径
2.3.2 图像标签
<img src="img/bc.jpg" />
<img src="img/bc.jpg" title="孙颖莎"/>
2.3.2.1 图像的替换文本说明
2.3.2.2 设置图像大小
<img src="img/bc.jpg" title="孙颖莎" width="350dp" height="200px"/>
2.3.2.3 图像的边框
<img src="img/bc.jpg" title="孙颖莎" width="350dp" height="200px" border="10px"/>
border标签
2.3.3 图像超链接
<a href="http://www.baidu.com"><img src="img/abc.jpg"/></a>
2.3.4 设置网页背景图像
<body background="img/abc.jpg">
2.3.5 图文混排
2.4 列表
2.4.1 无序列表
<ul>
<li>无序列表一</li>
<li>无序列表二</li>
<li>无序列表三</li>
</ul>
2.4.1.1 在<ul>后指定符号的样式
<ul type="circle">
<li>无序列表一</li>
<li>无序列表二</li>
<li>无序列表三</li>
</ul>
2.4.1.2 在<li>后指定符号的样式
<ul type="circle">
<li>无序列表一</li>
<li type="square">无序列表二</li>
<li>无序列表三</li>
</ul> 就近原则
2.4.2 有序列表
<ol>
<li>有序列表一</li>
<li>有序列表二</li>
<li>有序列表三</li>
</ol>
<ol type="A">
<li>有序列表一</li>
<li>有序列表二</li>
<li>有序列表三</li>
</ol>
2.4.3 定义列表
<dl>
<dt>院校名称：</dt>
<dd>江西应用工程职业学院</dd>
<dt>办学宗旨：</dt>
<dd>以人为本 培养高素质高技能人才</dd>
<dt>校训：</dt>
<dd>爱国明志 敢为人先</dd>
<dt>校园精神：</dt>
<dd>诚朴坚卓 达谦智勇</dd>
</dl>
2.4.4 嵌套列表
<h2>全球汇支付向导</h2>
<ul>
<li>全球汇支付方式</li>
<ul>
<li>货到付款</li>
<li>微信支付</li>
<li>支付宝</li>
<li>网银支付</li>
</ul>
<hr />
<ol type="1">
<li>有序列表一</li>
<li>有序列表二</li>
<li>有序列表三</li>
</ol>
<hr />
<dl>
<dt>院校名称：</dt>
<dd>江西应用工程职业学院</dd>
<dt>办学宗旨：</dt>
<dd>以人为本 培养高素质高技能人才</dd>
<dt>校训：</dt>
<dd>爱国明志 敢为人先</dd>
<dt>校园精神：</dt>
<dd>诚朴坚卓 达谦智勇</dd>
</dl>
扫一扫
1391
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
