真正零基础学习HTML5

HTML5手机应用的最大优势就是可以在网页上直接调试和修改。原先应用的开发人员可能需要花费非常大的力气才能达到HTML5的效果,不断地重复编码、调试和运行,这是首先得解决的一个问题。因此也有许多手机杂志客户端是基于HTML5标准,开发人员可以轻松调试修改。
编译html网页可以用windows自带记事本直接编写代码,但是需要更改文件后缀,但是需要把.txt改为.html。
sublime这款软件,其优点就是比起记事本它可以自动补全代码,而且比较精简软件链接如下:
https://pan.baidu.com/s/1AHSdOSqL4OEF9-QFTdYJzQ
*初学者比较适合的一款软件应该是dreamweaver,因为初学者无非希望编写错误可以高亮,并且可以自动补齐匹配.
https://pan.baidu.com/s/1wUcnG3dJVCO5cXAORmuxrQ
软件简易教程:1.先解压文件
2.打开文件夹真正零基础学习HTML5
3.找到dreaweaver.exe右键发送到桌面快捷方式真正零基础学习HTML5
4.桌面打开点击接受真正零基础学习HTML5

5.进入dreamweaver后点击HTML真正零基础学习HTML5
6.点击代码就会自动显示基本框架了真正零基础学习HTML5
7.编写后快捷键ctrl+a即可保存

这里先讲一些基础标签代码:
1.html是一种超文本标记语言(hypertext makrup language)因为它可以标记标签处理文字以外的图片.动画.视频等,它是一种网页标记语言。编程语言有:c java c++ php
2.访问网页需要通过浏览器http协议向服务器发布请求,然后服务器做出响应返出网页,本地访问不需要服务器处理
3.Chrome 谷歌浏览器【推荐】
4.编写代码需要成对以防忘记
5.基本结构
<html>
<head>标题 头</head>标题即为
真正零基础学习HTML5
<body>主体 内容</body>
</html>
6.主体背景颜色<body bgclor="颜色">
7.标题<h1>...</h1>
<h2>...</h2>
<h3>...</h3>
数字越大字号越小,标题独占一行,变大变粗,自动换行
<h1 align="center">标题居中
<h1 align="left">标题左对齐
<h1 align="right">标题右对齐
7.换行<br/>
8.分割线<hr/>
9.段落<p></p>——自动换行,行间距
10.预先格式化<pre>...</pre>
可预先在其中编辑调整好文本格式
11.字符格式<b>加粗</b>
<i>斜体<i/>
<u>下划线</u>
<s>删除线</s>
12.列表a.无序列表:没有标记序号只是有符合分开纵向排列 <ul type="circle"></ul>空心圆在前列表
<ul type="disc"></ul>实心圆
b.有序排列:有序号排列可以是数字,字母等
<ol type="1"></ol>数字排序
<ol type="a"></ol>字母排序
<ol type="A" start="2"></ol>大写字母排序并且从B开始
13.di标签:三国
刘备
关羽
张飞
<dl>
<dt>三国</dt>
<dd>刘备</dd>
<dd>关羽</dd>
<dd>张飞</dd>
</dl> L:list T:title D:data
14.水平线hr:分割线
<hr width="100px大小" align="right右对齐" />
<hr width="70%比例" align="center"居中 />
15.字体:c:\windows\fonts
<font size="6">内容</font>字号大
<font size="+6">内容</font>字号更大
<font face="MS Serif, New York, serif">内容</font>
字体样式
16.图像:a.绝对路径:<img src="图片路径"/>
b.相对路径:.当前目录
<img src="./aa/bg_1.jpg"/>
..返回上一级目录
<img src="../../images/bg_1.jpg"/>
17.超链接:<a href=”链接或网址 本地文件”>描述文字</a>
网页跳转
<a href="http://www.baidu.com">百度</a>跳外网必须加“http://”
<a href="1.html">本地文件</a>跳本地加文件名
18.锚点:点击链接跳转到想跳的内容
<a href="#aa">1</a>
<a name="aa">内容</a>
19.特殊字符:大于号> 小于号&it 引号" 空格 
20.meta标签:a.竞价排名
b.seo搜索引擎优化
<meta name="description" content="内容"/>
<meta name="Keywords" content="内容"/>
c.refresh刷新一段时间后访问另一个网址
<meta http-equiv="refresh" content="时间;url=网址"/>
d.字符集utf-8 、gbk 、gb2312
<meta charset="UTF-8">显示中文

附上简单的代码:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<body>
钟扬——植物学家,<p align="center">复旦大学教授</p>,在生命的最后16年,扎根青藏高原,带领团队收集4000万颗种子,盘点了世界屋脊的生物“家底”。钟扬——植物学家,复旦大学教授,在生命的最后16年,扎根青藏高原,带领团队收集4000万颗种子,盘点了世界屋脊的生物“家底”。<p >钟扬——植物学家,复旦大学教授,在生命的最后16年,扎根青藏高原,带领团队收集4000万颗种子,盘点了世界屋脊的生物“家底”。钟扬——植物学家,复旦大学教授,在生命的最后16年,扎根青藏高原,带领团队收集4000万颗种子,盘点了世界屋脊的生物“家底”。</p>
钟扬——植物学家,复旦大学教授,在生命的最后16年,扎根青藏高原,<br/>带领团队收集4000万颗种子,盘点了世界屋脊的生物“家底”。钟扬——植物学家,复旦大学教授,在生命的最后16年,扎根青藏高原,带领团队收集4000万颗种子,盘点了世界屋脊的生物“家底”。<br/>
鹅鹅鹅,<br/>
曲项向天歌。<br/>
白毛浮绿水,<br/>
红掌拨清波。<br/>
<pre>
鹅 鹅鹅,
曲项向天歌。
白毛浮绿水,
红掌拨清波。
</pre>
<b>红</b><i>掌</i><u>拨</u><s>清</s>波<br/>
<hr/>
<hr width="50%" align="right">
三国
<ul>
<li>刘备</li>
<li>关羽</li>
<li>张飞</li>
</ul>
<ol type="a" start="0">
<li>刘备</li>
<li>关羽</li>
<li>张飞</li>
</ol>
<dl>
<dt>三国</dt>
<dd>刘备</dd>
<dd>关羽</dd>
<dd>张飞</dd>
<dt>西游记</dt>
<dd>悟空</dd>
<dd>八戒</dd>
</dl>
<font>曲项向天歌</font>
</body>
</html>
效果如下图:真正零基础学习HTML5

学习总结:很多代码需要和英语相结合记忆,更重要的是要遇到问题及时解决,多加练习才能加深记忆熟能生巧,不懂的代码应该先打出来对比观察

猜你喜欢

转载自blog.51cto.com/13162615/2110965