美文网首页前端之旅Web 前端开发
零基础学Web前端开发(1)

零基础学Web前端开发(1)

作者: 进击的小明 | 来源:发表于2016-01-22 22:47 被阅读280次

    本人在2016年1月之前,从没有接触过web前端开发,现在自学web前端开发。从今天开始记录自己的学习历程。先补上前些天自学的内容。

    先默写一下刚学的html的基本结构吧。

    <!DOCTYPE html>

    <html>

    <head>

    <title></title>

    </head>

    <body>

    </body>

    </html>

    一个HTML文档由4个基本部分组成:

    ① 一个文档声明:<!DOCTYPE html>

    ② 一个html标签对:<html></html>

    ③ 一个head标签对:<head></head>

    ④ 一个body标签对:<body></body>

    html就是由一对对的标签组成。

    1、文档声明

    <!DOCTYPE html>声明这是一个HTML文档。

    2、<html>标签

    <html>标签的作用相当于设计者在告诉浏览器,整个网页是从这里开始的,然后到</html>结束。

    3、<head>标签

    顾名思义就是一个html文档的“头部”,里面只能写一些特点代码。

    4、<body>标签

    就是一个网页的“身体”,网页中绝大部分显示的内容都是在这里面输入的。

    一般来说:

    (1)对于HTML的基本结构,你至少要默写出来,这些都要记忆。

    (2)记忆标签小技巧:根据标签字母意思就很容易记忆了,比如表示“头部”,表示“身体”

    说到编写代码的工具,最简单的是windows(我自己是用的windows系统的电脑)自带的记事本就可以编写。我现在用的是Sublime Text编辑的,感觉蛮好用的。看麦子学院的视频里面的老师用的Notepad,达内的老师用的editplus,其实都差不多,适合自己用就好。每个老师都是建议不要用dreamever之类的软件,初期学习就要用越简单的越好,多写总是有好处的。

    选好工具之后就可以开始写代码了。先新建一个记事本,把.txt的后缀名改为.html保存,然后用自己喜欢的软件打开,写下自己的第一条代码,写一下最简单的网页结构吧。

    网页基本结构

    <head></head>标签:

    标签里只能放少数特定的几个标签。

    如标签,顾名思义是标题。

    title在网页中显示的位置

    常用的还有标签(meta标签是一个单标记标签),标签提供的信息不显示在页面中,一般用来定义页面的关键字、页面的描述等,以方便搜索引擎蜘蛛(如百度蜘蛛、谷歌蜘蛛)来搜索到你这个页面的信息。

    meta标签有两个重要的属性name和http-equiv。

    其中name主要属性如下(不止这几个):

    meta标签name属性主要属性值及其作用

    我们只需要了解它的两个作用就行了:

    一,定义页面所使用的语言。

    一般直接写不用写其他内容。

    二,实现页面的自动刷新跳转,但是前期我们用不到这个,不谈。

    <body></body>标签

    主要是用来放内容的,网页上要呈现的东西都是放在这里的。

    html注释

    html注释是在代码旁的注释,不会显示在网页中,但是可以在源代码中看到。能起到方便理解、方便查找或方便项目组里的其它程序员了解你的代码、方便以后你对自己代码进行修改等作用。

    写法:

    <!--注释内容-->

    相关文章

      网友评论

      本文标题:零基础学Web前端开发(1)

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