dw使用html语言吗,HTML基础知识与DW 基础应用

了解并体验代码实现原理

便于团队沟通，配合

学会简单页面的制作

初识Dreamweaver

初识HTML

HTML：Hyppertext Marked Language,超文本标记语言

CSS：Cascading Style SHEETS 层叠样式表

JS：Java Scrip 脚本语言。

常用开发工具

记事本(过于简单，效率低和慢)

Dreamweaver(所见即所得)

sublime text

其他..

要改变一些字体大小或颜色等等的参数，在首选参数里面修改。

image.png

HTML基本结构

下面这些都是基本结构，是必须要有的部分~

image.png

如果没有编码格式，打开之后会是一堆乱码，国际形式(utf-8)

image.png

注意：代码写好之后，保存的时候不能乱保存，所以保存之前先做一个准备工作，建立一个文件夹起好名字。将自己写好的代码保存的时候，要起英文的名字，比如首页的代码保存的时候应该命名为：index.html

注意事项：

不区分大小写，建议用小写

属性值建议加双引号

标签可以嵌套使用，按

注释

扩展名：.html

常用标签

双标签

段落里面的内容写在这里

文章内容的一级标题写在这里

文章内容的二级级标题写在这里

文章内容的三级标题写在这里

以此类推....

换行，这里是个单标签

图片，这里是个单标签

image.png

在建好的文件夹里，再建一个名字为images的文件件，专门放图片(所有图片都要用英文来命名，其实所有的有关文件都要用英文命名)

图像

alt后面跟的中文，起到一个说明的作用，比如在图片没有加载出来之前，会显示这个文字，能让用户提前知道这个将要加载出来的图片

image.png

• 无序列表

image.png

1. 有序列表

image.png

超链接

图片.png

比如： 可点击的文字

image.png

锚点链接

应用：长页面(如：百度百科、单页网站)

方法：

建立锚点目标位置

制作链接点击文本

其实就是简历一个快速引导，当页面比较长的时候使用的。

CSS样式基础

内嵌样式 加载head区

图片.png

表示颜色的方法：

h1{color:#096CFF;}

h1{color:red;} h1{color:blue;}

h1{color:rgb(200，30，10;}

h1{color:reba(200，30，10，0.5;} 注意：a是不透明度，值在0~1之间。

标题标签内的字体都是默认加粗的

图片.png

鼠标悬停时候的效果：下面设置了颜色和下划线

image.png

text-decoration:none;/去除链接文本中的下划线/

image.png

CSS中注释：/注释内容/