前端零基础入门：页面结构层HTML

HTML页面结构层HTML分以下方面学习：HTML基础，HTML表格，HTML表单，搭建网页结构

html基础

学习前端的第一门课程，为HTML基础，HTML标记语言，它是网页制作的第一步。

学习内容：HTML概念，了解HTML发展史，基础语法，常用标签（段落，图片，链接等）结合小例子

什么是HTMLHTML（Hypertext Markup Language）即超文本标记语言

html发展史1993（IETF）HTML1.01995（W3C）HTML2.01996（W3C）HTML4.01997（W3C）HTML4.0.12000（W3C）XHTML1.02001（w3c）xhtml1.1xhtml2.0?2004年（WHATWG）HTML5草案2008年（合并）HTML5正式版2014年HTML5定稿

html特点

HTML不需要编译，直接由浏览器执行HTML文件是一个文本文件HTML文件必须使用HTML或htm为文件名后缀HTML大小写不敏感，HTML与html一样

HTML是一个文本文件

HTML基础语法

学习内容HTML基本结构HTML标签HTML元素HTML属性注解

注解：div标签为块级结构布局元素，因此将在css中结合盒模型进行讲解。

HTML基本结构

// 头部信息

 

// 网页内容

 网页主体内容

html标签属性

语法： ...

DOCTYPE文档类型声明

声明必须放在html文档第一行

声明不是HTML标签

网页编码设置问题：当网页显示出现乱码时解决：在标签之间添加

注：utf-8，GB2312，gbk等编码

文字和段落标签

标题标签：

 ~ 

段落标签:

align对齐属性值：

值，描述
left 左对齐内容
right 右对齐内容
center 居中对齐内容
justify 对行进伸展，这样每行都可以有相等的长度。

换行标签：

列表标签

html标签html标记标签通常被称为HTML标签HTML标签是由尖括号包围的关键词HTML标签通常是成对出标签对中的第一个标签是开始标签，第二个标签是结束标签

什么是HTMLHTML是用来描述网页的一种语言HTML超文本标记

无序列表

 
1
 
2

type属性值：值，描述disc：圆点square：正方形circle：空心圆

有序列表

语法：

 
1
 
2

type属性值：值，描述：1，数字1,2，。。。a，小写字母a，b。。。A，大写字母A，B。。。i，小写罗马数字iI，大写罗马数字I

列表标签定义列表：

 
定义列表项
  
1
    
2
    
 
列表
  
1
    
2

定义标签内可以有多个

对于每一个

可以有多个

图像和超链接标签

图像标签语法：

img属性：属性，值，描述

src，url，显示图像的Urlalt，文字，图像替代文本height，数值和百分比，图像的高width，数值和百分比，图像的宽

HTML路径：相对路径绝对路径

超链接标签语法：

内容

href:链接地址，可以是内部链接或外部链接

超链接（空链接—target-title属性）

超链接标签属性，描述href:链接地址target:链接的目标窗口

self, blank, top, parent

title链接提示文字name链接命令

修饰标签和特殊符号

文字斜体：，

加粗：，

下标：

上标：

特殊符号：属性，显示结果，描述

< < 小于号或显示标记
> > 大于号或显示标记
® ® 已注册
@copy; © 版权
™ ™ 商标
  Space 不断行的空白

列表标签应用场景

锚链接（同一页面）

超链接标签定义锚：

目录1
目录2
内容
xxxx
内容
xxxx

在不同页面如何定义锚点定义锚（不同页面）：

网页1：...
网页2：...

html基本结构：语法： 例如：...

规范：1, 括起来2,成对出现，开始标签和结束标签，结束标签比开始标签多了一个/

HTML表格

基础表格

学习内容：了解表格应用场景表格基本结构如何操作表格表格属性表格跨行跨列表格嵌套

数据的展示

HTML表格

表格 行

单元格 若本号内容有做得不到位的地方（比如：涉及版权或其他问题），请及时联系我们进行整改即可，会在第一时间进行处理。 请点赞！因为你们的赞同/鼓励是我写作的最大动力！ 欢迎关注达达的简书！ 这是一个有质量，有态度的博客 展开阅读全文 点赞 评论 分享 x 海报分享 扫一扫，分享海报 收藏 手机看 分享到微信朋友圈 x 扫一扫，手机阅读 打赏 文章举报 打赏 达达前端 “你的鼓励将是我创作的最大动力” 5C币 10C币 20C币 50C币 100C币 200C币 确定 订阅博主 关注 收起全文 weixin_44023804的博客 09-18 21 第三周 周二作业 html>< html lang="en"> ... 添加代码片 HTML/XML objective-c Ruby PHP C C++ JavaScript Python Java CSS SQL 其它 还能输入1000个字符 weixin_34034261的博客 11-23 26 HTML基础4 ：页面布局 2019独角兽企业重金招聘Python工程师标准>>> ... weixin_30760895的博客 03-14 18 网页布局基础--简介 CSS盒子模型的4个属性：border（边框）、margin（外边距）、padding（内边距）、content（内容）。CSS布局模型主要有3种：流行模型、浮动模型、层模型。换言之，CSS中3种定位机制：标准文档流、浮动、绝对定位。一、标准文档流normal flow，这是默认的网页布局模式。如何实现网页的自动居中：body{width:7...... qq_43405634的博客 02-08 58 【慕课网】前端零基础入门---步骤二：页面化妆师CSS---06-CSS定位（position） 01-CSS选择的艺术第1章 CSS 基础语法1-1 CSS 基础语法1-2 CSS使用方法1-3 CSS使用方法优先级第2章 CSS选择器2-1 选择器（标签选择器和类选择器）2-2 选择器（ID选择器）2-3 群组选择器和全局选择器2-4 css后代选择器2-5 伪类选择器第3章 CSS继承、层叠和优先级3-1 CSS继承和层叠3-2 css选择器优先级3-3 css权...... weixin_33877092的博客 03-14 24 3.13作业 制作网页布局 1，position：fixd锁定位置（相对于浏览器的位置），例如有些网站的右下角弹窗。2，position：absolute 绝对定位3，position：relative 相对定位4，filat：left，right流布局overfiom：hidden 超出部分隐藏 qq_43405634的博客 02-13 40 【慕课网】前端零基础入门---步骤三：页面升级结构HTML5---02-HTML5属性变化 01- HTML5标签变化第1章 HTML5简介第2章 DOCTYPE声明2-1 doctype2-2 DTD第3章 HTML5新增标签2-1 结构标签2-2 结构标签简单使用2-3 结构标签使用补充2-4 audio2-5 video2-6 embed2-7 多媒体标签的意义2-8 状态标签2-9 列表标签2-10 注释标签2-11 其他标签第4章 HTML5删...... 张飞鹏的博客 03-27 71 前端开发基础：这些网页布局方法你都知道吗？ 最近很多小伙伴在学习 基础布局的时候很纠结布局方法，那么就要就来给大家总结几个常用的 页面架构布局方案，看完可以随收收藏起来，以后都能用到今天讲解的布局大致可以分成两种布局，分别是居中布局和多列布局。这两种布局又有好几种小布局方案，一起来看看吧！居中布局a.水平居中b.垂直居中c.水平垂直多列布局a.自适应布局b.等宽布局c.等高布局居中布局 HTML代码水平居中在水平居中里...... weixin_30343157的博客 03-15 18 常出现的css样式（适合刚入门的小伙伴） 1.textarea : resize:none ->设置不可拉升2.text-overflow: ellipsis + overflow:hidden + white-space + width or max-width -> 实现超过文本框限制的字符时以省略号的形式出现3.cursor: pointer 设置手型4.word-break : break-all word... art8886565的博客 01-17 8 1-16作业 《第 04 讲:一维数组》1. (*)先调试,调试成功后抄写下列程序: #include #define SIZE 10int main(int argc, char *argv[]){int a[SIZE] = {0},i= 0;for(i = 0; i < SIZE; i++){a[i] = i+10... 风萧萧兮易水寒，壮士一去兮不复还 07-25 93 零基础学编程-CSS 现已推出零 基础学编程系列的第二部分内容：CSS视频教程，该视频介绍了常用的CSS的 入门 基础知识，包括选择器、背景、文本、字体、列表、表格、定位、伪元素、导航栏、下拉菜单、Tooltip提示工具、图片拼合技术等等。总时长为760‬分钟，总大小为3.47G，共73节，包括如下内容：CSS是什么 CSS规则和注释 CSS颜色值的写法 选择器的分组 派生选择器 ID选择器 Class选择器...... 想使网页b.htm的内容总是与a.htm保持一致的语句怎样写? 08-02 bree的博客 04-06 304 HTML+CSS基础入门-第十六天（CSS-列表属性） 标记的类型list-style-type属性值none：无标记disc：默认标记是实心圆circle：标记是空心圆square：标记是实心方块decimal：标记是数字decimal-leading-zero：0开头的数字标记（01,02,03等）lower-roman：小写罗马数字（i，ii，iii，iv，v）upper-roman : 大写罗马数字（I，II，III，IV，V）... weixin_30588729的博客 08-20 15 08-20作业整理 将数组中数字内容求和 var attr = [12,34,2,5,76]var attr = [12,34,2,5,76]; var sum=0; for(var i=0;i ⊳ideal world⊲~ヽ(ﾟ︺ﾟ)Hi 06-26 55 系分 | About 1、项目简介挣闲钱是面向大学生的专业“众包”系统，大学生通过做任务挣钱，轻松赚取生活费，生活中的棘手、为难事情，都可以通过在挣闲钱发布任务来解决。2、重要分析设计文档需求规格说明书软件设计说明书产品演示视频3、敏捷开发迭代管理与大事纪Inceptionsgoal: 就产品“产品范围、愿景和核心业务”达成一致前期工作：产品调查：xxx团队组织项目启动会议：所有人项目...... 星辰_大海的博客 06-10 83 HTML布局 HTML 布局 - 使用<div> 元素div 元素是用于分组 HTML 元素的块级元素。下面的例子使用五个 div 元素来创建多列布局：<!DOCTYPE html>< html><head> <meta charset="utf-8"> <title>pa ge title</title&g... Victor的BLOG 10-16 83 作业10-16 1.求1到20的阶乘之和；#include  int main()    {      int i,s=0,p=1;      for(i=1;i        {p*=i;            s+=p;          }    printf("sum=%d\n",s);  return 0;  }结果为：sum=2680407292 GMstart的专栏 08-30 1756 webkit网页布局（1）数据结构 注：我在转载的 基础上增加了自己的一些观点。在有了对CSS网页布局标准及相关概念的认识之后，我们可以更加深入的理解WebKit究竟是如何实现其网页布局，同时实现对CSS布局标准的支持。毕竟标准归标准，要高效的实现这些标准，不同的实现肯定有其不同的实现方式，就像不... 01-06 63 CSS让大的banner图主区域居中显示 　　 weixin_33709590的博客 03-09 23 CSS基本知识(慕课网) 　　1、注释　　　　注解：CSS中注释/*这里是注释的文字*/   HTML中注释<!--这里是注释的文字--> 　　2、外部式css样式，写在单独的一个文件中　　　　注解：外部式css样式(也可称为外联式)就是把css代码写一个单独的外部文件中，这个css样式文件以“.css”为扩展名，在<head>内（不是在<style>标签内）使用<li...... weixin_30399055的博客 10-05 23 一、HTML和CSS基础--网页布局--网页简单布局之结构与表现原则 　　结构、表现和行为分离，不仅是一项技术，更主要的是一种思想，当我们拿到一个网页时，先考虑设计图中的文字内容和内容模块之间的关系，重点放在编写 html结构和语义化，然后考虑布局和表现形式。，减少 HTML与CSS耦合度。　　案例一：微博对话框html PUBLIC "-//W3C//DTD X HTML 1.0 Transitional//EN" "http://...... ©️2020 CSDN 皮肤主题: 程序猿惹谁了 设计师: 上身试试 返回首页 目录 分类专栏 node.js圣经 1篇 前端之设计模式秘籍 2篇 HTTP协议网络原理 2篇 达达前端指路 78篇 小程序云开发 Github源码 2篇 达达后端指路 1篇 MySQL数据库圣经 2篇 前端数据结构与算法系列 3篇 问题排查能力，解决方案 24篇 uniapp从入门到顿悟 微信小程序开发 31篇 H5网站页面开发 前端打包技术总结 ES5.0与ES6.0精通语法 8篇 HTML，CSS，JS前端开发经验 8篇 产品技术分析与产品体验 前端组件化，模块化开发 1篇 app前端页面开发 前端页面开发与实现 1篇 Vue框架精通之路 9篇 JavaScript精巧简明 6篇 HTML5和CSS3开发经典 3篇 其他分类 553篇 应支付 0元 点击重新获取 扫码支付 支付成功即可阅读