web前端学习之旅笔记01--HTML
web前端学习之旅笔记01--HTML
HTML最容易上手,但也易忘,实际开发中有时需要查阅官方文档,小伙伴们别忘了哟!
HTML是网页的骨架负责页面的结构,css负责表现,js负责行为
HTML概述:
HyperText Mark-up Language 意思是超文本标记语言,超文本指超链接,标记指标签,这个扩展名为.html或.htm的文本文件使用浏览器打开,被浏览器按标签描述渲染成网页,显示的网页可以跳转到对应的网页。
HTML基本结构:
<!-- 文档声明,声明当前网页的版本 -->
<!doctype html>
<!-- html的根标签(元素),网页中的所有内容都要写根元素的里边 -->
<html>
<!-- head是网页的头部,head中的内容不会在网页中直接出现,主要用来帮助浏览器或搜索引擎来解析网页 -->
<head>
<!-- meta标签用来设置网页的元数据,这里meta用来设置网页的字符集,避免乱码问题 -->
<meta charset="utf-8">
<!-- title中的内容会显示在浏览器的标题栏,搜索引擎会主要根据title中的内容来判断网页的主要内容 -->
<title>网页的标题</title>
</head>
<!-- body是html的子元素,表示网页的主体,网页中所有的可见内容都应该写在body里 -->
<body>
<!-- h1网页的一级标题 -->
<h1>网页的大标题</h1>
</body>
</html>
HTML字符实体:
  空格
> 大于
< 小于
<br/> 换行
HTML标签:
<div>块标签,无具体语义
<span>行标签,无具体语义
带样式标签
<em>行内元素,表示语气强调词,文字倾斜
<i>表示专业词汇,文字倾斜
<b>表示文档中的关键字或者产品名,文字加粗
<strong>表示非常重要的内容,文字加粗
语义化标签
<h1>标题
<p>段落
<ul><li>列表
HTML图片
<img src="相对路径" alt="加载失败显示,盲人读屏文字显示"/>
./ 当前文件所在目录
../ 当前文件所在目录的上级目录
HTML链接
<a>在网页上定义一个链接地址
href属性:定义跳转地址
title属性:定义鼠标悬停提示
target属性:定义链接打开位置
“_self”:原位置打开
“_blank”:新开浏览器窗口打开
<a href="#">跳转到页面顶部<a>
HTML列表
在html中也可以创建列表,html列表一共有三种:
1、有序列表
2、无序列表
3、定义列表
无序列表,使用ol标签来创建无序列表
使用li表示列表项
无序列表,使用ul标签来创建无序列表
使用li表示列表项
定义列表,使用dl标签来创建一个定义列表
使用dt来表示定义的内容
使用dd来对内容进行解释说明
HTML表格
<table border="1" width="300" hight="100">//列
<tr>行
<td></td>//格子
</tr>
</table>
HTML布局
就是排版,传统布局即table布局(EDM邮件),现在流行HTML+css布局
下一篇做个 个人简历的传统table布局
HTML具体中文文档链接在下面哦!
HTML 教程 (w3school.com.cn)
web前端学习之旅笔记01--HTML的更多相关文章
- 每天成长一点---WEB前端学习入门笔记
WEB前端学习入门笔记 从今天开始,本人就要学习WEB前端了. 经过老师的建议,说到他每天都会记录下来新的知识点,每天都是在围绕着这些问题来度过,很有必要每天抽出半个小时来写一个知识总结,及时对一天工 ...
- 【前端】Web前端学习笔记【2】
[2016.02.22至今]的学习笔记. 相关博客: Web前端学习笔记[1] 1. this在 JavaScript 中主要有以下五种使用场景 在全局函数调用中,this 绑定全局对象,浏览器环境全 ...
- 【前端】Web前端学习笔记【1】
... [2015.12.02-2016.02.22]期间的学习笔记. 相关博客: Web前端学习笔记[2] 1. JS中的: (1)continue 语句 (带有或不带标签引用)只能用在循环中. ( ...
- Web前端学习笔记(001)
....编号 ........类别 ............条目 ................明细....................时间 一.Web前端学习笔记 ...
- web前端学习笔记
web前端学习笔记(CSS盒子的定位) 相对定位 使用相对定位的盒子的位置常以标准流的排版方式为基础,然后使盒子相对于它在原本的标准位置偏移指定的距离.相对定位的盒子仍在标准流中,它后面的盒子仍以标准 ...
- 【web前端学习部落22群】分享 碰撞的小球开源小案例
对于课程中的疑问,大家可以加 web前端学习部落22群 120342833和其他老师还有众多的小伙伴们进行沟通交流哦,群里还有不少技术大拿.行业大牛 可以一起探讨问题,我们也会安排专业的技术老师为大家 ...
- web前端学习部落22群开源分享 左边菜单导航
有大量web前端开发工具及学习资料,可以搜群[ web前端学习部落22群 ]进行下载,遇到学习问题也可以问群内专家以及课程老师哟 <!DOCTYPE html> <html lang ...
- 立方体旋转 【web前端学习部落22群120342833】
效果: HTML部分: <body class="body"> <div class="rect-wrap"> <!-- // ...
- 2015 WEB前端学习路线图
2015 WEB前端学习路线图,欢迎小伙伴补充 @落雨
随机推荐
- java-面向对象之类、对象
什么是类?什么是对象? 1)现实世界是由很多很多对象组成的基于对象抽出了类 2)对象:真实存在的单个的个体 类:类别/类型,代表一类个体 3)类中可以包含: 3.1)所有对象所共有的属性/特征---- ...
- XYX错误集
(频数递减) # 数据范围:没开Long Long (*inf^2) # while 打成了 if ,if 打成了 while(*inf^2) # 换根DP:两个dfs调用错误 (*inf) # ZK ...
- 【python】一些python用法规律笔记
作为本科用了多年MATLAB的工科生,学起来python有些似曾相识但也有些不习惯的地方. 在这里总结一下,慢慢整理,希望能巩固python语法 一.前闭后开 这个是和MATLAB很大不同.不论是ra ...
- C++ 对于函数名的操作,函数名本身和取*以及取&的区别
void TestFunc() { } int _tmain(int argc, _TCHAR* argv[]) { cout<<TestFunc<<endl; cout< ...
- 并发编程Bug起源:可见性、有序性和原子性问题
以前古老的DOS操作系统,是单进行的系统.系统每次只能做一件事情,完成了一个任务才能继续下一个任务.每次只能做一件事情,比如在听歌的时候不能打开网页.所有的任务操作都按照串行的方式依次执行. 这类服务 ...
- python(第四版阅读心得)(系统工具)(一)
本章将会讲解python常用系统工具的介绍 python中大多数系统级接口都集中在两个模块: sys 和 os 但仍有部分其他标准模块也属于这个领域 如: 常见: glob 用于文件名扩展 soc ...
- 03_Linux基础-文件类型-主辅提示符-第1提示符-Linux命令-内外部命令-快捷键-改为英文编码-3个时间-stat-其他基础命令
03_Linux基础-文件类型-主辅提示符-第1提示符-Linux命令-内外部命令-快捷键-改为英文编码-3个时间-stat-{1..100}-du-cd-cp-file-mv-echo-id-she ...
- Lua 支持虚函数的解决方案
概述 lua本身没有提供类似C++虚函数机制,调用的父类方法调用虚函数可能会出现问题. 问题分析 分析这段代码和输出 local Gun = {} -- 示例,实际应用还要考虑构造,虚表等情况 fun ...
- ProxySQL(8):SQL语句的重写规则
文章转载自: https://www.cnblogs.com/f-ck-need-u/p/9309760.html 为什么要重写SQL语句 ProxySQL在收到前端发送来的SQL语句后,可以根据已定 ...
- SNI 路由和多协议端口的 TCP
文章转载自:https://mp.weixin.qq.com/s/nMMN7hAJK6SFn1V1YyxvHA 下面是一个简单的示例配置 - 使用最新支持的 YAML 文件格式,将请求路由到一个数据库 ...