作为一名IT届的后生,当初也经历过懵懂无知的实习期,对那种无力感深有体会。在这,希望能用我这几年的开发经验,让各位即将踏入或者刚刚踏入web开发领域的新人们少走些弯路。鉴于这是入门篇,下面我就从零为大家介绍。

  这里我主要介绍基于 H5,CSS,JS,PHP的web开发,入门篇的内容简单,完全可以自学,下面就为大家整理些制作静态网页的基础知识。以下是HTML5的内容。

  HTML5:万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言HTML)的第五次重大修改。博主我用的是HBuilder做开发,下面具体介它的常用标签,若有介绍不详尽的地方或者难以理解的地方,请浏览 w3cschool查看,或者是给我留言。

  

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title></title>
  </head>
  <body>

  </body>

</html>

  以上是HTML5文件的基本结构,HTML5的基本元素是标签,每个标签都有自己的功能,一条条标签组成了一个HTML5文档。如上图,HTML结构主要包括三大部分:文档声明部分、<head>头部部分、<body>主体部分。!DOCTYPE 文档声明,html则是被声明的文档类型,<!DOCTYPE html>说明这是一个html文档,这句是我们必须写且写在最开头的东西。<html></html>是一对标签,表明以下是这个html文档的内容了,此标签可以省略(但是博主不推荐初学者省略,以博主多年工作经验来看,养成一个严禁优良的开发习惯对程序员以后影响是很大的),<head></head>他是html文档的头部,里面放这个网页的标题,字符集编码格式,及一些CSS文件链接。<body></body>是html文档的身体部分,里面放的是html文档具体内容的格式要求。html文档的其他标签都放在<head></head>和<body></body>当中。

 下面说一下html文档的使用规范:

  1.标签是html最基本单位和最重要的组合。
  2.标签使用 <> 扩起来
  3.标签是成对存在的<head>是开始,</head>他就是结束(当然也有半闭合标签,这个我们后续介绍)

  4.标签有属性,而标签的属性有属性值(这个我们将在后面详细介绍)
  5.标签的属性和属性值必定是成对出现,而且一个标签可以有多个属性

 现在我们介绍一下head中的常用标签:

  1.link 标签,用来链接网页图标或者CSS文件的。

       <link rel="icon" type="image/x-icon" href="img/QQ截图" />

    上述代码,rel,type和href都是link标签的属性,所谓属性就是,比方说,一个人可以有勇敢、聪明 、漂亮等很多特点来描述他,这些就是属性,而漂亮又可以分为倾国

  倾城,一般漂亮等多个程度,这些修饰漂亮的程度就是属性值。好了,我们继续之前的话题。  rel属性,声明链接文件的类型,说明你链接的文件是啥样的;type 可以省略,

  这里暂且不详尽介绍; href属性,表示你所连接文件的路径地址。以上是link标签的常用属性,其他属性大家可以百度  w3cschool 查阅。

  今天的博客就先写到这,后续内容博主会坚持1~3期不定期更新。

Mr.聂 带你成为web开发大牛——入门篇(上)的更多相关文章

  1. 【ZZ】Web开发的入门指导 | 菜鸟教程

    Web开发的入门指导 http://www.runoob.com/w3cnote/a-beginners-guide-to-web-development.html

  2. Laravel 教程 - Web 开发实战入门 ( Laravel 5.5 )购买链接

      Laravel 教程 - Web 开发实战入门 ( Laravel 5.5 )购买链接: 推荐给你高品质的实战课程 https://laravel-china.org/courses?rf=158 ...

  3. 详细阐述Web开发中的图片上传问题

    Web开发中,图片上传是一种极其常见的功能.但是呢,每次做上传,都花费了不少时间. 一个"小功能"花费我这么多时间,真心不愉快. So,要得认真分析下原因. 1.在最初学习Java ...

  4. 基于hi-nginx的web开发(python篇)——使用jinja2模板引擎

    模板引擎的使用在web开发中是不可避免和必要的.hi.py框架使用jinja2作为模板引擎. 为了使用hi.py提供的jinja2引擎,首先需要引入它: from hi import hi,templ ...

  5. 移动WEB开发基础入门

    什么是移动WEB开发,我个人理解就是,将网页更好的显示在移动端的一些设置,简单来说就两点如下: 1.流式布局,即百分比自适应布局 将body下的div容器的样式设置如下: div{ width:100 ...

  6. ASP.NET Web API 之一 入门篇

    一.基于RESTful标准的Web Api 原文讲解:https://www.cnblogs.com/lori/p/3555737.html 微软的web api是在vs2012上的mvc4项目绑定发 ...

  7. 【数据库】Mean web开发 04-MongoDB在Linux上的安装及遇到的问题

    简介 Mean是JavaScript的全栈开发框架.更多介绍 用MongoDB实现持久数据的存储是Mean Web全栈开发中的一部分. MongoDB是一个介于关系数据库和非关系数据库之间的产品,是非 ...

  8. Flask Web开发从入门到放弃(一)

    第1章 章节一 01 内容概要 02 内容回顾 03 路飞学城之加入购物车 04 路飞学城之结算 05 路飞学城之立即支付 06 路飞学城之后续计划 07 Flask框架简介和快速使用 08 FLas ...

  9. java Web开发实现手机拍照上传到服务器

    第一步: 搭环境,基本jdk 1.6+apache tomcat6.0+myeclipse2014 1.我们要清楚自己的jdk版本.因为我们Apache Tomcat配置的成功的前提是版本相对应. 安 ...

随机推荐

  1. CMake Tutorial

    1.最简实例 使用cmake的最简实例是由一个源程序文件生成一个可执行文件.例如由下述C++源程序文件生成可执行文件tutorial. main.cpp #include<iostream> ...

  2. Js把IE COM数组列表转换成数组

    今天写组件的时候遇到一个问题,就是当我需要对获取到的对象列表进行删减的时候,发现没有合适的方法,比如: //获取图片列表 var imgs = document.getElementsByTagNam ...

  3. UWP 中实现一个颜色选择器 UWPColorPickerControl

    最近在实现一个远程数字白板时,发现UWP平台上颜色选择不方便,因此自己动手写了一个. 效果图 实现 <UserControl x:Class="UWPColorPickerLibrar ...

  4. OC字符串的使用(一)

    #import <Foundation/Foundation.h> int main(int argc, const char * argv[]) { @autoreleasepool { ...

  5. php分页原理教程及简单实例

    <?php //连接数据库 $con = mysql_connect("localhost","root",""); mysql_se ...

  6. 【BZOJ 3926】【ZJOI 2015】诸神眷顾的幻想乡

    http://www.lydsy.com/JudgeOnline/problem.php?id=3926 广义后缀自动机的例题,感觉广义后缀自动机好恶心... 广义后缀自动机是对一个trie建立的后缀 ...

  7. Firebug控制台详解,让调试js代码变得更简单

    http://www.open-open.com/lib/view/open1373120100347.html Firebug是网页开发的利器,能够极大地提升工作效率. Firebug控制台详解 控 ...

  8. 分布式环境中三种Session管理方法的使用场景及优缺点

    在分布式环境,管理Session通常使用下面三种方式: 一.Session Replication 方式管理 (即session复制)         简介:将一台机器上的Session数据广播复制到 ...

  9. 查看Eclipse版本号,及各个版本区别

    查看Eclipse版本号,及各个版本区别 参考:http://blog.csdn.net/gaojinshan/article/details/38903043 查看Eclipse版本号的方法:1.找 ...

  10. Apriori算法原理总结

    Apriori算法是常用的用于挖掘出数据关联规则的算法,它用来找出数据值中频繁出现的数据集合,找出这些集合的模式有助于我们做一些决策.比如在常见的超市购物数据集,或者电商的网购数据集中,如果我们找到了 ...