前端开发-html-简介

Alice的小屋      2022-02-11     749

关键词:

[TOC]

一、web1.0时代的网页制作

静态网页,所谓的静态网页就是没有与用户进行交互而仅仅供读者浏览的网页,我们当时称为“牛皮癣”网页。例如一篇QQ日志、一篇博文等展示性文章。
网页三剑客 Dreamweaver+Fireworks+Flash”吧,这个组合就是web1.0时代的产物。

二、web2.0时代的前端开发

前端开发”是从“网页制作”演变而来的。
从2005年开始,互联网进入web 2.0时代,由单一的文字和图片组成的静态网页已经不能满足用户的需求,用户需要更好的体验。
在web 2.0时代,网页有静态网页和动态网页。所谓动态网页,就是用户不仅仅可以浏览网页,还可以与服务器进行交互。
web2.0时代的网页不仅包含炫丽的动画、音频和视频,还可以让用户在网页中进行评论交流、上传和下载文件等(交互性)。

三、前端开发都有哪些内容

网页最主要由3部分组成:结构、表现和行为。网页现在新的标准是W3C,目前模式是HTML、CSS和JavaScript。
HTML:网页的结构
    HTML,全称“Hyper Text Markup Language(超文本标记语言)”,简单来说,网页就是用HTML语言制作的。HTML是一门描述性语言,是一门非常容易入门的语言。
CSS:网页的外观
    CSS,全称“(层叠样式表)”。以后我们在别的地方看到“层叠样式表”、“CSS样式”,指的就是CSS。
JavaScript:页面的行为
    JavaScript是一门脚本语言。

四、开发环境

HTML编辑器,常见的Hbuild、Sublime Text、Dreamweare都可以用来开发HTML。当然PyCharm也支持HTML开发。(*.html / *.htm)

五、HTML

HTML作为一种标记语言它并没有什么逻辑,简单来说就是一些符号,一些有特殊意义的符号,一些浏览器认识的有特殊意义的符号。

1.标签

在HTML中规定标签使用英文的的尖括号即`<`和`>`包起来,如`<html>`、`<p>`都是标签。
HTML中标签通常都是成对出现的,分为开始标签和结束标签,结束标签比开始标签多了一个`/`,如`<p>标签内容</p>`和`<div>标签内容</div>`。开始标签和结束标签之间的就是标签的内容。
标签之间是可以嵌套的。例如:div标签里面嵌套p标签的话,那么`</p>`必须放在`</div>`的前面。
HTML标签不区分大小写,`<h1>`和`<H1>`是一样的,但是我们通常建议使用小写,因为大部分程序员都以小写为准。

2.HTML文档结构

技术分享图片

<!DOCTYPE HTML>是文档声明,必须写在HTML文档的第一行,位于<html>标签之前,表明该文档是HTML5文档。
<html></html> 称为根标签,所有的网页标签都在<html></html>中。
<head></head> 标签用于定义文档的头部,它是所有头部元素的容器。常见的头部元素有<title>、<script>、<style>、<link>和<meta>等标签,头部标签在下一节中会有详细介绍。
<body>和</body>标签之间的内容是网页的主要内容,如<h1>、<p>、<a>、<img>等网页内容标签,在<body>标签中的内容(图中淡绿色部分内容)最终会在浏览器中显示出来。
HTML文档包含了HTML标签及文本内容,不同的标签在浏览器上会显示出不同的效果,所以我们需要记住最常见的标签的特性。

3.HTML注释:

  <!-- xx部分 开始 -->
  这里放你xx部分的HTML代码
  <!-- xx部分 结束 -->

前端基础开发之html

简介:                                  查看详情

html简介

因为公司业务需要,做python开发的我,需要准备前端开发,所以想要做好,必须基础扎实,从基本的做起,我会记录我在学习过程中的学到的知识点。一、html简介  -html是超文本标记(标签)语言  -它负责网页的三个要素... 查看详情

bootstrap简介--目前最受欢迎的前端框架

Bootstrap,是目前最受欢迎的前端框架。Bootstrap是一个用于快速开发Web应用程序和网站的前端框架。Bootstrap是基于HTML、CSS、JAVASCRIPT的。Bootstrap是由Twitter的MarkOtto和JacobThornton开发的。Bootstrap是2011年八月在GitHub上发布的开源产品。Bo... 查看详情

sass简介

1.Sass来源Sass来源于css,在早期前端页面是由设计师来制作的时候,css是设计师使用的网页样式设计语言,没有变量、条件判断和循环等典型的编程语言的特点。因此css和html一样都不是一门编程语言。随着前端开发工程师的出现... 查看详情

前端开发html5——表单标签

表单简介  Form表单主要用于用户与Web应用程序进行数据的交互,它允许用户将数据发给web应用程序,网页也可以拦截数据的发送以便自己使用。form通常由一到多个表单元素组成,这些表单元素是单行/多行文本框,下拉菜单,... 查看详情

前端html简介

...但是必须要有网页需要呈现的内容。所以HTML部分是整个前端的基础。 HTML,全称是超文本标记语言(HyperTextMarkupLanguage),它是一种用于创建网页的标记语言。标记语言是一种将文本(Text)以及文本相关的其他信息结合起来... 查看详情

web前端基础--html简介

HTML简介超文本标记语言(英语:HyperTextMarkupLanguage,简称:HTML)是一种用于创建网页的标准标记语言。HTML文档的后缀名:.html和.htm,这两种后缀名没有区别,都可以使用。HTML实例<!DOCTYPEhtml><html><head>  <metachars... 查看详情

零基础学习web前端开发:html第一部分基础知识的综合案例

零基础学习WEB前端开发(一):网站及web标准简介零基础学习WEB前端开发(二):HTML标签及开发工具零基础学习WEB前端开发(三):VsCode工具生成的代码框架分析零基础学习WEB前端开发(四):HTML文本编辑标签及分块标签零... 查看详情

前端之bootstrap(代码片段)

Bootstrap简介  Bootstrap是一个前端框架、是目前最受欢迎、最流行的web前端框架、是Twitter公司的MarkOtto和JacobThornton一起开发的,Bootstra框架是基于HTML、CSS、JavaScript开发的,它因简洁、直观、功能强大被开发者广发使用。  Boot... 查看详情

大学生怎么全面地学习前端开发

前端行业的薪资居高不下,对于想入门的小白却不知道如何学起,今天爱前端考拉老师告诉你小白如何开启前端学习以及需要掌握哪些知识点。学习对象:0基础,对互联网充满热情,想要从事H5前端开发、全栈开发的学员;第一... 查看详情

前端开发框架简介:angular和react

作者:vienwureact是facebook推出一个用来构建用户界面的js库。官方介绍的三大特性如下:justtheui把react只当作一个ui组件就好,等同于传统mvc中的view。virtualdomreact在编程模型和传统dom之间添加了一层,称之为虚拟dom。好处非常多,... 查看详情

前端开发之css篇

一、css简介  css(CascadingStyleSheets)层叠样式表,是一种为html文档添加样式的语言,主要有两个功能:渲染和布局。使用css主要关注两个点:查找到标签,属性操作  二、css的引入方式(1)行内式引入:<divstyle="color:red;fo... 查看详情

bootstrap的简介

...f1a;BootStrap,来自Twitter,目前是比较受欢迎的一款前端UI库,用于HTML、CSS、JS开发的开源工具集。能够迅速搭建前端页面,非常适合于前端能力初中级的后端开发工程师。其界面美观上档次,具有丰富的第三方... 查看详情

angular简介

1、angular简介  一款非常优秀的前端高级JS框架由MiskoHevery等人创建2009年被Google公式收购,用于其多款产品有一个全职的开发团队继续开发和维护这个库有了这一类框架就可以轻松构建SPA应用程序通过指令扩展了HTML,通过表达... 查看详情

前端html-简介-基本概念

一、HTML简介HTML定义: 超级文本标记语言是标准通用标记语言下的一个应用,也是一种规范,一种标准,它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件,通过在文本文件中添加标记符,可以... 查看详情

前端开发工程师-06.mini项目实战-项目简介

...顾:页面制作页面架构JavaScript程序设计DOM编程艺术产品前端架构实践课Mini项目--Ego:主题:漫画阅读、二次元文化、漫画创作者产品背景:爱画漫画的用户基数大、展示作品可以获得认可关注从而提高画技、寻找同好、寻找灵... 查看详情

前端小白基础学习课程大纲

...一阶段:页面制作基础从这一基础阶段开始,正式学习Web前端开发需要的编程语言HTML,CSS和JavaScript。HTML和CSS用于Web静态内容的展示,JavaScript用于Web动态交互。完成这一阶段前端开发的学习,你就可以独立实现一个动静结合的Web... 查看详情

网站开发(周五):项目前端页面开发(实战)

第一、前端基础简介前端网页:根据此前项目需求分析可知,我们需要开发网站首页、文章分类页、搜索页、正文页、标签页,而一个最基本网页模版有三部分,网页顶部导航条、网页中部主体、网页底部,其中顶部和底部布局... 查看详情