企业官网建设流程全解析

WordPress更改网站地址,中国公司网站建设,网站开发费入什么费用,静态网站是什么原因目录 前言 概念 html的基本使用 标签语法#xff1a; 标签的关系#xff1a; 1.父子关系#xff1a; 2.兄弟关系#xff1a; 3.祖先后代关系#xff1a; 解析一下网页开发结构中语句含义 实体 标签的分类 搭建框架应该遵循的规范 前言 学习html#xff0c;我们…目录前言概念html的基本使用标签语法标签的关系1.父子关系2.兄弟关系3.祖先后代关系解析一下网页开发结构中语句含义实体标签的分类搭建框架应该遵循的规范前言学习html我们要先下载代码编辑器目前使用较多的软件为HBuilderX,以及VS Code等。在接下来的学习中我们使用VS Code来进行学习。常用快捷键1、shift! :快速生成网页开发结构英文状态下回车后即可出现如图代码我们称之为“网页开发结构”常用快捷键2、ctrl/生成注释一些与代码无关的内容写在注释里不会对编译造成影响概念在前端中有html,css,js这些语言是什么作用呢?html语言搭建页面的结构 --- 相当于盖房子css语言修饰页面 -- 相当于给房子装修js语言实现页面交互 -- 例如满足逻辑条件点击跳转登录验证相当于智能家居html的基本使用学习html就是学习各种标签常用的标签大概有30-40种标签语法单标签自闭和标签标签名 或者标签名/双标签开始标签名/结束标签名标签的关系1.父子关系直接包含和被包含的关系父标签父元素— 子标签子元素例如html与head2.兄弟关系拥有共同的父元素例如head和body他俩都有html这个父亲而在上图网页开发结构中head在body的上面所以head为兄标签兄元素body为弟标签弟元素因为编译从上往下3.祖先后代关系直接或间接包含于被包含的关系祖先后代关系也包含父子关系祖先标签祖先元素后代标签后代元素例如html和metahead标签的完整写法开始标签名 属性名属性值 属性名属性值 ...../结束标签名解析一下网页开发结构中语句含义!DOCTYPEhtml-- 声明标签文档是html类型告诉浏览器按html规范编译防止乱码html标签又叫根标签 是所有标签的祖先标签所有的代码都必须放在html里面并且一个html文件只能有一个html标签。lang属性en属性值 lang属性配置编写代码的语言 en属性值英文,默认就是英文html langenhead标签 主要用来配置网页的基本信息例如页面标题栏标题配置网页的描述信息关键字等等 配合浏览器收录页面headmeat标签本身没有作用但它可以配置不同的属性于属性值从而起到不同的作用charset属性UTF-8属性值 防止出现乱码 charset属性指定字符集是一种密码本UTF-8属性值万国码。密码本的一种编码将页面文本、图片等内容编译成计算机所能识别的语言解码将计算机储存的语言还原成页面的文本和图片等内容乱码编码和解码用的不是同一个标准metacharsetUTF-8 /配置完美视口主要用于移动端开发meta nameviewport contentwidthdevice-width, initial-scale1.0 /配置网页的描述信息也可帮助浏览器进行检索metanamedescriptioncontent淘宝网 - 亚洲较大的网上交易平台提供各类服饰、美容、家居、数码、话费/点卡充值… 数亿优质商品同时提供担保交易(先收货后付款)等安全交易保障服务并由商家提供退货承诺、破损补寄等消费者保障服务让你安心享受网上购物乐趣/!-- 配置网页的搜索关键字也可以帮助浏览器进行检索 --metanamekeywordscontent淘宝,掏宝,网上购物,C2C,在线交易,交易市场,网上交易,交易市场,网上买,网上卖,购物网站,团购,网上贸易,安全购物,电子商务,放心买,供应,买卖信息,网店,一口价,拍卖,网上开店,网络购物,打折,免费开店,网购,频道,店铺/title百度一下-- title标签配置页面标题是html标签中语义最重的标签可以帮助提高浏览器搜索link relshortcut icon hrefhttps://www.baidu.com/favicon.ico typeimage/x-icon--配置标题图标/headbody/body-- body标签书写网页主体内容主要给用户看的/html实体1、什么是实体html语言会提前征用一部分字符关键字它用了程序员就不能直接使用如果程序员需要只能用一些额外的字符去替代这些额外的字符我们就称之为实体2、实体语法实体的名字;3、常见的实体有哪些标签的分类形式分单标签meta····· 双标签htmlheadbody····特点分块标签主要用来搭建网页结构框架1、独占一行2、可以设置宽高大小3、如果宽度未设置它的宽度是父元素的100%如果高度没设置高度是被内容撑开的常用的块标签h1-h6,p,center,div,ul,ol,li,header,main,footerside,section······行内标签用来包裹具体内容1、不会独占一行2、不可以设置宽高3、宽高是被内容撑开的常用的行内标签a,em,strong,i,span,del·····行内块标签特殊的标签具有自己独有的功能1、兼具块标签行内标签的特点不会独占一行可以设置宽高2、标签与标签之间具有大概3像素左右的间距常用的行内块标签imginputbutton·····搭建框架应该遵循的规范1块标签可以包裹任意标签2行内标签一般只包含文字不能包含块标签3块标签只有一个特殊的标签p标签只能包裹文字不可以嵌套块标签4行内标签内有一个特殊的标签a标签它可以包裹任意标签