一、文本格式化标记
----------------------1、各类标签及描述
二、HTNL链接
----------------------1、HTML链接语法
----------------------2、在当前页面跳到指定位置
----------------------3、图片链接
三、插入视频、图片、列表项、邮件链接
---------------------1、插入Flash video
---------------------2、插入HTML5 video
---------------------------------①HTML5 video无法播放及解决办法
四、表单标记
---------------------1、普通的文本、单选框、复选框标记
---------------------2、可下拉列表框；
五、好看的CSS按钮
（老司机跳过、萌新必看）在开始编辑之前请看DWCC的一些基本使用注意要点
DWCC2018基本网页设计使用技巧、注意要点 - CSDN博客 https://blog.csdn.net/cwyp18809/article/details/82826626
（有知识性错误或者其他问题请联系本人：QQ：[email protected]"备注CSDN+问题"----------临沂大学软工5班王育鹏）
一、文本格式化标记
| 标签 | 描述 |
|---|---|
<strong> |
加粗字体 |
<big> |
大号字 |
<em> |
着重字（斜体） |
<small> |
小号字 |
<sub> |
定义下标字 |
<sup> |
定义上标字 |
<ins> |
给文本加下划线 |
<del> |
给文本加删除线 |
<abbr> |
定义缩写 |
<bdo> |
改变文本排版顺序 |
<q> |
给文本加引号 |
代码示例：
<body>
<p><strong>加粗字体 </strong></p>
<p><big>大号字</big></p>
<p><em>着重字</em></p>
<p><small>小号字</small></p>
<p>定义<sub>下标字</sub></p>
<p>定义<sup>上标字</sup></p>
<p>给文本<ins>加下划线</ins></p>
<p>给文本加<del>删除线</del></p>
<p>定义缩写:The <abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
</p><p><bdo dir="rtl">从右往左排</bdo></p>
<p><q>给文本加引号</q></p>
</body>
注意要点：
- 缩写
<abbr>
应用举例：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.`
<abbr>的作用是将People’s Republic of China缩写为PRC当鼠标移动到PRC上时，将会以角标的形式显示其全称
2. 改变文本的排序方向<bdo>
应用举例：
<bdo dir="rtl">从右往左排</bdo>
<bdo>是将文本逐字从右往左排出
<div align="right">hehe</div>是将文本在文本框中右对齐，只是将文本整体右移
二、HTML链接
1.HTML链接语法：
在现有窗口打开<a href="url">Link text</a>
href 属性描述了链接的目标
新建窗口打开<a href="http://www.baidu.com/" target="_blank">访问百度!</a>
target 属性则是让你在新的窗口打开链接
2.在当前页面跳到指定位置：
代码应用举例：直接跳至第4章
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>我的网页(runoob.com)</title>
</head>
<body>
<p>
<a href="#C4">查看章节 4</a>
</p>
<h2>章节 1</h2>
<p>这边显示该章节的内容……</p>
<h2>章节 2</h2>
<p>这边显示该章节的内容……</p>
<h2>章节 3</h2>
<p>这边显示该章节的内容……</p>
<h2><a id="C4">章节 4</a></h2>
<p>这边显示该章节的内容……</p>
<h2>章节 5</h2>
<p>这边显示该章节的内容……</p>
</body>
</html>
<a href="#C4">查看章节 4</a> 描述目标地址
<a id="C4">目标名称</a>将目标地址定义为“C4”（PS:引号里的字符随便写，但是要和前面的a href="#C4"中的引号里字符的相同）
3.图片链接
传统代码实现方式：
（伪代码）
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>我的网页(runoob.com)</title>
</head>
<body>
<p>创建图片链接:
<a href="http://www.runoob.com/html/html-tutorial.html">
<img border="10" src="在此处添加图片地址" alt="HTML 教程" width="32" height="32"></a></p>
<p>无边框的图片链接:
<a href="http://www.runoob.com/html/html-tutorial.html">
<img border="0" src="在此处添加图片地址" alt="HTML 教程" width="32" height="32"></a></p>
</body>
</html>
**DWCC2018实现方式：**片热点链接建立
插入图片–>选择图片–>窗口右下角
有三种热点链接标记方式
注意：必须在“设计”状态下才会出现如上图的热点链接标记方式
添加链接：
方法一：直接输入完整链接；
方法二：通过文件夹查找本地网页；
方法三：左键连接框旁的准心不放指向右边“文件栏”里的你想要指向的网页或文件
三、插入视频、列表项、邮件链接
右侧工具栏——>插入
可插入image（图片）、Flash动画、音频等 一般只需要根据系统提示一步步操作即可
①插入Flashvideo （插入好后，实时浏览到浏览器看看是否成功）
插入视频时，应将视频转码为flash格式再插入。
视频类型一般默认累进式下载视频，流视频需要服务器支持
②插入HTML5 video（插入好后，实时浏览到浏览器看看是否成功）
右侧工具栏–>HTML5 video
选择如上图的图标–>下方的属性栏
在“源”处插入视频的地址：①点击地址栏右侧的文件夹图标浏览，找到视频添加即可：
②左键地址栏右侧的准心不放，拖到右侧文件栏（右上半部分）中你想插入的文件上；
插入完成：
注意：如果视频播放出现无效源、无法解码等问题，可将视频转码为mp4-AVC格式（具体过程可参考下方链接）
转码工具格式工厂：http://d.z3tkd.com/nb/nsoft_988.html
如何将视频转化为 AVC (H264)视频编码格式：
https://jingyan.baidu.com/article/22fe7cedfdd4ca3002617f8f.html
额外知识：MP4有3种编码，mpg4(xdiv),mpg4(xvid)，avc(h264)，
只有h264才是公认的MP4标准编
四、表单标记：
①普通的文本、单选框、复选框等都在DWCC的插入里都能找到
②可下拉列表框：
HTML 标签、 标签
代码示例：
<!DOCTYPE html>
<html>
<body>
<select>
<option value="1">项目1</option>
<option value="2" >项目2</option>
<option value="3">项目3</option>
<option value="4">项目4</option>
</select>
</body>
</html>
一般情况下：<select>标签默认第一个<option>选项为默认值，如上图示例选择框未展开时默认选择项目1
在<option>中加入selected即可将当前标签设置为默认选项
代码示例：
<!DOCTYPE html>
<html>
<body>
<select>
<option value="1">项目1</option>
<option value="2" selected>我是项目2，但我是默认选择的</option>
<option value="3">项目3</option>
<option value="4">项目4</option>
</select>
</body>
</html>
四、好看的CSS按钮：
具体设置方法：http://www.runoob.com/css3/css3-buttons.html
