HTML入门系列
Anthony_tester
这个作者很懒,什么都没留下…
展开
-
HTML入门笔记1-HTML介绍
背景 从这篇开始,新写一个系列,主要用来记录学习HTML的过程,鞭策自己完成整个教程的学习,顺便通过博客文章的方式,记录学习过程。我想这是一个很好的学习方法,如果你也打算学习一个新的技能,这里我也建议你和我一样,边学习,然后通过写笔记或者文章的方式,记录学习过程。还有一个原因是接下来会学习web开发,简单的web开发。什么是HTMLHTML 是用来描述网页的一种语言。原创 2017-07-13 23:18:15 · 1739 阅读 · 0 评论 -
HTML入门笔记14-HTML中插入图片标签
本篇学习HTML中插入图片标签,img是英文单词image的缩写,主要有三个参数,scr的值需要写图片的路径,height表示图片高度,width表示图片宽度,下面我们用百度首页图片来演示。需要提前把百度首页图片保存到本地,例如我在桌面创建一个HTML的文件夹,里面有baidu.png和当前演示的demo.html两个文件。原创 2017-07-22 22:48:19 · 2488 阅读 · 1 评论 -
HTML入门笔记15-HTML中插入外部链接
本篇学习HTML中链接标签,表示超链接的意思,我们来演示一次,在demo文件中点击一个文字,然后跳转到百度首页的场景。 HTML插入图片 百度首页原创 2017-07-22 23:09:13 · 7592 阅读 · 1 评论 -
HTML入门笔记16-HTML相对链接
本篇学习HTML中相对链接写法,就像我们看电子书,点击左侧目录章节名称,就会自动跳转到对应内容。下面我们就写一个demo.html来模仿这种行为。 HTML的相对链接用法 一些文字简介描述,随便写一些。原创 2017-07-25 23:42:42 · 1500 阅读 · 0 评论 -
HTML入门笔记17-HTML中图片内嵌链接
本篇学习在HTML中图片内嵌链接,前面我们写了图片在HTML中的显示,知道图片需要和当前demo.html文件放在同一个文件夹下或者指定具体磁盘路径。我们在这个基础之上,在图片里添加一个链接。点击图片就跳转到这个链接的网站。这个在好多门户网站的,banner图片中经常使用,例如我们,在新浪体育,点击其中一个图片,会跳转到这个图片内嵌的新闻页面。我们现实百度图片,点击图片,会跳转到新浪体育。原创 2017-07-27 21:20:21 · 3377 阅读 · 0 评论 -
HTML入门笔记18-HTML中点击链接发送邮件
本篇学习点击一个链接,触发邮件客户端弹窗。有些网站,我们点击邮件联系管理员,有时候会弹窗,这个弹窗,需要你本地安装并配置了outlook客户端才能弹出。如果没有任何邮件客户端,点击链接是没有效果的。看看一个例子,我们设置发生邮件给谁,邮件主题和邮件内容都可以指定。 HTML mail 链接原创 2017-07-27 22:55:49 · 23919 阅读 · 1 评论 -
HTML入门笔记19-HTML中Order List标签
本篇来学习下HTML中Order List标签,什么是Order List呢,字面意思是顺序列表。直接来看看例子。 HTML mail 链接 Ordered List举例 张三 李四 王原创 2017-07-27 23:09:19 · 4014 阅读 · 0 评论 -
HTML入门笔记20-HTML中Unorder List标签
前面一篇介绍了如何使用Ordered List,今天来学习下Unordered List的几种使用。1.默认无序显示举例 HTML mail 链接 Ordered List举例 张三 李四原创 2017-07-27 23:24:49 · 1244 阅读 · 0 评论 -
HTML入门笔记21-HTML定义列表
前面几篇,我们都在学习list,今天我们学习Definition list,中文的意思是定义列表。和顺序列表和无序列表差不多,都是列表范畴,一般我们介绍一个有描述一个事物,有多个点和多个值,点和值都是成对出现的时候,我们建议采用标签。来看看下面例子。 HTML 自定义链接原创 2017-07-28 21:51:39 · 788 阅读 · 0 评论 -
HTML入门笔记22-HTML内嵌音频文件
本篇来学习下HTML中如何播放一个mp3文件,也就是如何内嵌一个音频文件。本来想找一个好听点歌曲来放上去,结果发现全部歌曲下载都需要安装客户端,而且下载还需要登录用户名和密码,果断卸载和放弃,还是利用系统自定音频文件在路径:C:\Users\Public\Music\Sample Music HT原创 2017-07-28 22:22:49 · 1915 阅读 · 0 评论 -
HTML入门笔记23-HTML内嵌视频文件
前面一篇我们学习了如何内嵌一个音频文件到HTML文件中,现在我们学习如何内嵌一个视频文件到HTML中,我们用mp4文件举例。 我们拷贝一个mp4文件到和当前demo.html文件在同一个文件夹,把视频命名test.mp4 HTML 内嵌视频原创 2017-07-28 22:57:17 · 1050 阅读 · 0 评论 -
HTML入门笔记24-HTML表格举例
本篇来学习下HTML中表格的使用,在HTML中表格用标签,结合表格标签,一般有 三种标签。tr (table row)元素定义表格行,th(table head) 元素定义表头,td 元素定义表格单元。 HTML 表格原创 2017-07-28 23:18:31 · 797 阅读 · 0 评论 -
HTML入门笔记13-HTML中font标签
本篇练习HTML中的字体标签,用来显示控制文本大小,颜色和字体,font下主要学习三个属性,face表示字体,例如我们常说的宋体和隶书,还有微软雅黑。size表示文本的字体大小。color表示文本显示的颜色。 HTML中字体标签原创 2017-07-22 22:16:52 · 949 阅读 · 0 评论 -
HTML入门笔记8-上脚注和下脚注标签
本篇学习HTML中上脚注和下脚注标签。上脚注长什么样呢?想想一下3的3次方的数学写法就知道了。有时候wold文档里面脚注和文献中脚注都需要用到上脚注或者下脚注。<!DOCTYPE html HTML中上角标和下角标标签 文本上显示删除线 33等于 27 aa*b 等于 c c 表示文本上显示删除线表示上脚注表示文下脚注运原创 2017-07-18 23:42:22 · 5848 阅读 · 0 评论 -
HTML入门笔记7-粗体、斜体和下划线标签
本篇介绍HTML中字体效果,分别是粗体和斜体以及下划线效果。HTML中标签表示粗体,是英文打次blod的缩写;用标签标签斜体,是英文单词italic的缩写;用表示下划线,是英文单词underline的缩写。直接来看看下面的例子,很简单。<!DOCTYPE html HTML中的粗体,斜体和下划线标签 这是粗体效果 这是斜体效果 这是原创 2017-07-18 23:01:31 · 8692 阅读 · 0 评论 -
HTML入门笔记2-HTML中meta标签
本篇来学习下HTML中的meta标签,其实前面文章的demo.html我们使用过meta这个标签,我们在设置字符编码的时候,在head标签里面使用了meta标签。 元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。 标签位于文档的头部,不包含任何内容。 标签的属性定义了与文档相关联的名称/值对。 在使用meta标签的时候,c原创 2017-07-15 23:24:58 · 1139 阅读 · 0 评论 -
HTML入门笔记3-HTML中h1到h6标签
本篇学习HTML中的标题控制标签,我们知道标题指的是文章文章的标题,或者每个段落前面那个标题,就像word里面会根据不同层级标题进行显示目录。在THML中标题写在body标签下,一共有六级标题,h1表示最大标题,h2表示第二大标题,直到h6表示最小标题。记住,只有六级标题,标题标签有一个align属性,就是控制标题左对齐还是右对齐,或者居中显示的这个属性,现在不推荐使用,推荐用样式调整而不是直接在原创 2017-07-15 23:40:04 · 2457 阅读 · 0 评论 -
HTML入门笔记4-段落标签和换行
这篇学习HTML的段落标签和换行。前一篇我们知道HTML中用标签表示不同大小字体的标题,在HTML中段落用表示,段落英文单词第一个字母的缩写就是p,下面来看看例子,主要学习段落写法和断行写法。<!DOCTYPE html HTML中的段落标签p 这是 第一段落 第二段落 第三段落 换行 效果截图原创 2017-07-16 22:53:34 · 1980 阅读 · 0 评论 -
HTML入门笔记9-big和small标签
本篇学习HTML中字体控制效果中的big和small标签。 标签呈现大号字体效果,浏览器显示包含在 标签和其相应的 标签之间的文字时,其字体比周围的文字要大一号。但是,如果文字已经是最大号字体,这个 标签将不起任何作用。同理,标签呈现小号字体效果。如果被包围的字体已经是字体模型所支持的最小字号,那么 标签将不起任何作用。直接来看一个例子<!DOCTYPE html原创 2017-07-20 21:51:30 · 1735 阅读 · 0 评论 -
HTML入门笔记10-em和strong标签
本篇学习下短语强调标签,em和strong都是让字体显示不同样式,和其他区分开来的显示,都是表示强调,strong强调语气更重。现在用这两个标签很少,一般都采用样式。<!DOCTYPE html HTML中em和strong标签 这个很重要 语气更加强调有电危险 运行效果原创 2017-07-20 22:00:11 · 1255 阅读 · 0 评论 -
HTML入门笔记11-blockquote和q标签
本篇学习HTML中长引用的标签,有blockquote和q两种。1.先来看看长引用的效果<!DOCTYPE html HTML中em和strong标签 我们很多人都听说过三个和尚没水喝的故事: 从前有一座山,山上有一座庙, 庙里有三个和尚。有一天没有水了,三个和尚都不想挑水, 都指望别人干,结果大家都没水喝 2.原创 2017-07-20 22:17:40 · 1058 阅读 · 0 评论 -
HTML入门笔记12-HTML中备注写法
本文学习HTML中备注写法。备注,在写代码的时候非常重要,特别是写给其他人看,你可以随意打开一个网页,右键,查看源码,基本上都可以看得到前面写的HTML备注。在HTML中备注是用,同时,在XML中也是y使用这个备注。<!DOCTYPE html HTML中em和strong标签 我们很多人都听说过三个和尚没水喝的故事: <!-- 从前有一原创 2017-07-20 22:24:25 · 5872 阅读 · 0 评论 -
HTML入门笔记5-居中标签和空格
这篇学习HTML中的居中标签和如何控制空格显示。1.先看看居中效果,这里用标题来演示。默认不使用居中会在居左显示。<!DOCTYPE html HTML中的居中标签center 标题居中显示 这个居左边显示 2.如果我想要标签内容左边缩进2空格如何实现,我们在html代码中直接敲两个空格试试<!DOCTYPE ht原创 2017-07-17 22:14:16 · 2676 阅读 · 0 评论 -
HTML入门笔记6-pre和hr标签
本篇学习HTML中pre标签和hr标签。pre是预格式化文本的标签,hr是horizon rule的缩写,左右就是创建一条水平线。1.先来看看pre,有时候我们需要带格式显示一些东西,输出效果要如下图我们正常安装来显示,看看能不能到达目的。<!DOCTYPE html HTML中的pre和hr标签 我有一个故事要讲给你听。。。。。。。。原创 2017-07-17 22:35:20 · 1779 阅读 · 0 评论 -
HTML入门笔记26-HTML中文本输入框和单选按钮
本篇学习HTML中的表单,我们知道,登录和注册页面一般都写在表单里面,HTML中有的标签。一般一个表单中,有几部分组成。有文字描述,有文本输入框,有选择按钮。今天我们先来看看表单中的文本输入框和单选按钮如何使用。场景:我们想做一个,在网页注册中常见的,输入用户名和选择性别的场景,相关html代码如下。原创 2017-07-30 22:32:26 · 2423 阅读 · 0 评论 -
HTML入门笔记27-HTML一个简单的表单设计
这篇在前面一篇文章基础上,在表单页面增加了一部分功能,有复选框和文本框,还有文件选择和提交按钮。为了尽可能的模拟,我们平时在网页上注册的场景,我们来设计一个如下图的页面。项目HTML内容如下。 HTML 表单1原创 2017-07-30 22:57:06 · 2101 阅读 · 0 评论 -
HTML入门笔记25-HTML改变背景颜色
本篇学习改变背景颜色,在HTML中背景颜色用bgcolor表示,我们继续在前一篇表格基础上,添加一个背景颜色设置。我们把第一行设置绿色,第二行设置黄色,第三行设置蓝色,第四行设置粉色,具体效果如下图。 HTML 表格原创 2017-07-28 23:24:11 · 3798 阅读 · 0 评论