从零开始的html教程(1):html是什么?怎么编辑一个网页呢?

前言

Html(HyperText Markup Language,超文本标记语言)是一门用来创建网页的语言,网页浏览器就是通过读取HTML文件,并将其渲染成可视化网页的。这篇是教程针对编程方面零基础的同学的,html属于编程语言相对简单的,我相信大家看了这篇教程后都能够亲手制作出自己的网页

一、如何设计出一个网页?

利用windows自带的文本编辑器或者HTML编辑器即可制作出一个网页。

网页通常由html、css、javascript这三种语言组成。我们要学习的html是网页的基本框架css(层叠样式表)是用来结构化文档添加样式的,通俗点说就是用来美化网页的;javascript是一门动态类型,面向对象的高级编程语言,我们平常上网在网页上看到的绚丽的特效与点击按钮提交数据等,就是用JS实现的。这篇教程建议大家使用Dreamweaver这款软件,语法高亮显示、自动完成等功能,可以让大家不用强记一大堆HTML指令和更方便的编写HTML。

二、我们先用Dreamweaver创建一个页面吧!

(如果还没有下载软件的同学请戳这里dreamweaver网盘下载与安装教程

1.打开软件后首先建议大家使用标准模式的拆分功能,打出代码的同时就会显示出网页的效果,方便学习。界面右上角可以切换模式,有两种模式,分别为:开发人员模式标准模式

2.点击左上角的文件后选择新建,出现如图示界面,什么都不用改,用默认的配置就行了。点击右下角的“新建”。

3.这就是我们创建的第一个网页了。我们可以看到,黑色框内容修改之后,白色框内及时反映了出来。

大家在学习的过程中一定要使用下面黑色框内的文本编辑器编辑,养成良好的代码习惯

时间: 2024-10-26 13:23:42

从零开始的html教程(1):html是什么?怎么编辑一个网页呢?的相关文章

从零开始的html教程(6):超链接的知识与html5播放视频

一.如何链接到其他网页? 超链接是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置,还可以是一个图片,一个电子邮件地址,一个文件,甚至是一个应用程序.而在一个网页中用来超链接的对象,可以是一段文本或者是一个图片.当浏览者单击已经链接的文字或图片后,链接目标将显示在浏览器上,并且根据目标的类型来打开或运行. html中插入<a>标签就可以添加超链接了,具体格式是这样的<a href="url">XXX</a>.

从零开始的html教程(2):了解基本的标签与元素

一.html中的标签 上一课利用dreamweaver自动生成的页面的代码为: <!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> </head> <body> </body> </html> "<html>""</body&

jQuery插件开发精品教程,让你的jQuery提升一个台阶

原文:jQuery插件开发精品教程,让你的jQuery提升一个台阶 要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生态系统.这好比大公司们争相做平台一样,得平台者得天下.苹果,微软,谷歌等巨头,都有各自的平台及生态圈. 学会使用jQuery并不难,因为它简单易学,并且相信你接触jQuery后肯定也使用或熟悉了不少其插件.如果要将能力上升一个台阶,编写一个属于自己的插件是个不错的选择. 本教程可能不是最精品的,但一定是最细致的. jQuery插件

photoshop设计一个网页登陆框图片制作教程

给各位photoshop软件的使用者们来详细的解析分享一下设计一个网页登陆框图片的制作教程. 教程分享: 先看看最终效果:   1.新建一个文档,这里我用的是400*300像素,填充一个#d0c0be的颜色填充调整层.   2.选择画笔工具,使用圆角柔边画笔,设置前景色为#364e35,画出如下图中的形状出来.   3.执行"滤镜-模糊-高斯模糊",我用的数值是46.9像素,赋予这个颜色层一个模糊效果,跟我们的背景融合.   4.选择圆角矩形工具,并设置前景色为#313c45,画一个圆

PS网页设计教程IV——如何在Photoshop中创建一个专业博客网站布局

向Talk-Mania网站致敬.一年前,在该网站上看过许多不错的网页设计教程.一年后,再回头想看看有没有什么新的教程的时候,蓦然发现该网站已经打不开了.也许是关闭了,也许是改了网站名了.幸好,去年本人还是下载保存了几个教程,本教程就是其中之一.也希望能看到更多的PS网页设计教程的网站,以及更多优秀的设计.   约定: 1.本文的软件是Photoshop CS5版本 2.原教程的截图是英文的,本人在重新制作的基础上,重新截了中文版的图 3.原文中有些操作没有给出参数.本人在反复测试的情况下测定了一

PS网页设计教程XXVIII——如何在PS中创建一个干净的网页布局

作为编码者,美工基础是偏弱的.我们可以参考一些成熟的网页PS教程,提高自身的设计能力.套用一句话,"熟读唐诗三百首,不会作诗也会吟". 本系列的教程来源于网上的PS教程,都是国外的,全英文的.本人尝试翻译这些优秀的教程.因为翻译能力有限,翻译的细节上还有待推敲,希望广大网友不吝赐教. 约定: 1.本文的软件是Photoshop CS5版本 2.原教程的截图是英文的,本人在重新制作的基础上,重新截了中文版的图 3.原文中有些操作没有给出参数.本人在反复测试的情况下测定了一些参数,以红色的

从零开始的html教程(7):html表单基础之一

一.html的表单 表单负责网页中用户输入数据采集的功能,利用<form>标签来定义一个表单.<form>...</form>form标签中间的数据将会上传至服务器处理 二.表单中最重要的元素--<input>元素 input必不可少的type属性有很多种类型,我们来逐一讲解一下. 1.text属性,<input type="text"> text是用来文本输入的,举个例子,在页面主体里添加: <form> 搜索:

从零开始的html教程(5):图像插入与表格介绍

一.如何插入图像? <img>元素可以向网页插入图片,<img src="XXX" />,XXX就是图片的路径,可以是本地路径或者网址,例如:<img src="http://www.htmq.com/images/logo.gif" />就是链接的网页地址.<img>标签没有结束标签,跟<br>标签一样加个斜线"/",完整的形式应该是<img src="" /

从零开始的HTML教程(0):安装并破解最新版的Adobe DreamWeaver CC 2017(附带百度盘下载地址)

1.在这个百度盘下载最新版本DWhttps://pan.baidu.com/s/1nvbcv6h,密码:r7ce. 破解补丁:http://pan.baidu.com/s/1gfypgsz,密码:3kis. 2.DW CC2017下载并解压后如图 3.先关闭网络连接(如果连着网会安装不了哦),再打开解压后的"Set-up.exe"安装程序,就会自动开始安装了. 4.等安装完成后先不要打开.刚才下载的破解补丁解压缩后打开"AMTEmu v0.9.1",出现如下图所示界