美文网首页
对html的简单入手

对html的简单入手

作者: dtythicc | 来源:发表于2017-03-22 23:37 被阅读0次

关于编写环境,我用的是Sublime Text 3,再搞一些插件,很好用。

怎么开始学习html?我准备从看懂一段含有基础功能的html开始。

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>网页名称</title>
</head>

<body>
    <h1>这是一个标题</h1>
    <p>这是一个段落</p>
    <hr> <!--这是一条分界线,而这句话本身是个注释,两头符号即注释符号-->
    <a href="http://www.jianshu.com/">点了这个链接你就到了简书首页</a>
    ![图片说明](https://img.haomeiwen.com/i3567272/1b877fcb23926535.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
</body>
</html>

一段简单的代码,那么我们现在要做的就是读懂她。

我们先看看大体框架:

<html>
<head>...</head>
<body>...</body>
</html>
<!DOCTYPE html>

第一行这一句是个什么东西呢?

  • 意义:html5标准网页声明,告诉浏览器网页采用html5。
  • 作用:给浏览器一个解析渲染页面的标准(W3C),避免不同浏览器显示不同的样式
  • 注意:这句话要放在整个html文件的前面
<html></html>

<标签></标签>这个形式叫做标签对,html中的标签往往成对出现(当然不是全部),而这一对标签对则是html页面的根元素。

<head></head>

包含文档元数据。
这一对标签中可以包含很多东西,不只是title,meta等元素,还可以嵌入JavaScript,css代码或者.js文件。

<meta charset="utf-8">

这句话告诉网页你的文件以utf-8格式编码,防止中文乱码。

<body></body>

光是看名字就看的出这对标签很重要,<body>标签定义了HTML文档主体;
< h1 >,< h2>...< h6>按字体由大到小定义6种标题,< p>则定义了段落;
<a href=url>...</a>为引入链接
< img src=... width=... height=... alt=...>为引入图片,其中src的参数可以传入图片对应(网络或者本地)地址。

现在你可以让你的浏览器运行一下上述代码,你的第一个html实例将出现在你眼前!


效果图

相关参考

charset="utf-8"有什么作用
什么是<!DOCTYPE html>及<!DOCTYPE html>的重要性?|代码恶童

以上

相关文章

  • 对html的简单入手

    关于编写环境,我用的是Sublime Text 3,再搞一些插件,很好用。 怎么开始学习html?我准备从看懂一段...

  • html入手准备

    2018.3.12 开发软件 火狐,VScode,Git,Node.js 基础知识 1.html的开发浏览器2.编...

  • iOS对html简单解析

    例如后台返回如此数据让你截取: 这时你就需要解析当前content了 方法 1 方法 2 //对html简单解析 ...

  • HTML 转 PDF

    几种HTML转PDF工具的对比 工具特点html2image简单html转化,对CSS的支持不好itextpdf需...

  • 任务四——课程作业2

    二、如何理解 HTML 语义化 我个人的理解是从概念入手。 结合自己总结HTML的概念来看: 1.HTML是超文本...

  • 扣丁学堂HTML5培训简述HTML5新特性之语义化标签

    对HTML5开发技术感兴趣的小伙伴对HTML5的文档类型了解吗?相信大多数的小伙伴对HTML5 简单的文档类型:都...

  • react组件

    一、什么是组件 组件(Component)是对数据和方法的简单封装,react还包括对html的简单的简单封装 二...

  • 入手简单爬虫

    前置知识和要求: Python基本语法,程序逻辑基础完成 了解HTML 正则表达式 推荐视频:Python开发简单...

  • vim 简单入手教程

    1.简介 Vim(Vi[Improved])编辑器是功能强大的跨平台文本文件编辑工具,继承自Unix系统的Vi编辑...

  • SnapGene简单入手(二)

    按照实验需求,质粒构建分为克隆质粒,表达质粒,基因敲除质粒,报告质粒,病毒质粒,基因组工程质粒等。 这部...

网友评论

      本文标题:对html的简单入手

      本文链接:https://www.haomeiwen.com/subject/myxrnttx.html