html+css 知识点总结 day1(01-08)
01 初步认识浏览器

02 浏览器内核
IE 内核:Trident, win10 Edge 内核:EdgeHTML
Firefox(火狐浏览器) 内核:Gecko
Safari,内核:Webkit,苹果公司开发。
Chrome 内核:Blink 渲染引擎(浏览器核心),为Webkit 分支,国内绝大多数浏览器内核都是用Blink。
Presto 内核:Opera (已废弃)
03 Web 标准
不同浏览器解析出的效果不同,开发者要开发多个版本,Web标准不是一个标准,而是一系列标准集合。
结构 (Structure )元素分类整理HTML
表现 (Presentation),网页元素大小,颜色,CSS
行为 (Behavior),动态的交互,JS
04 HTML 骨架
HTML 超文本标记语言。
运用sublime软件,打开,新建一个后缀名为html的文件。

html 根标签
head 头部标签
body 文档主题
05 标签关系

<html> </html>和 <head></head> 两者嵌套(父子)关系

<head></head>
<body></body> 两者是并列关系


保存——浏览器打开 快捷键 html+tab,出现骨架,但不完整,后手动补齐(此疑问之后会找出原因)
效果图:

06 文档类型字符集

标签语义化:清晰的了解内容

07 排版标签
<title>文档标题(易混淆)
标题标签:<h1></h1> 、<h2></h2>、<h3></h3> 、<h4></h4> 、<h5></h5> 、<h6></h6>
总共6级标签,没有<h7></h7>!!!

效果图:

段落标签:

效果图:

水平线标签:<hr />

效果图:

综合案例:

效果图:

08 div & span
换行标记 <br />
<br />与<p></pr>区别

效果图:

换行的间距小,段落的间距大。
div 和span 标签没有语义,只是布局的两个盒子

效果图:


效果图:

html+css 知识点总结 day1(01-08)的更多相关文章
- CSS知识点集锦
CSS知识点集锦 CreateTime--2016年9月29日09:43:10Author:Marydon UpdateTime--2017年3月21日08:03:13 2.CSS样式优先级问题 ...
- 这些HTML、CSS知识点,面试和平时开发都需要 No1-No4
系列知识点汇总 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5-No7(知识 ...
- 这些HTML、CSS知识点,面试和平时开发都需要 No5-No7
系列知识点汇总 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5-No7(知识 ...
- 这些HTML、CSS知识点,面试和平时开发都需要 No8-No9
系列知识点汇总 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5-No7(知识 ...
- 这些HTML、CSS知识点,面试和平时开发都需要 No10-No11
系列知识点汇总 1.基础篇 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5- ...
- css知识点
css知识点 一.盒模型知识 border: 边框 border-width:边框的宽度 border-color:边框的颜色 border-style:边框的线型 border-top:上边框 bo ...
- Spring知识点回顾(01)Java Config
Spring知识点回顾(01) 一.Java Config 1.服务和服务注入 2.Java 注解 :功能更强一些 3.测试验证 二.注解注入 1.服务和服务注入 2.配置加载 3.测试验证 三.总结 ...
- 这些HTML、CSS知识点,面试和平时开发都需要 No8-No9(知识点:媒体操作、构建表单)
系列知识点汇总 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5-No7(知识 ...
- 这些HTML、CSS知识点,面试和平时开发都需要 No10-No11(知识点:表格操作、代码编写规则)
系列知识点汇总 1.基础篇 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5- ...
随机推荐
- SVG基础绘图实例
SVG可缩放矢量图(Scalable Vector Graphics),是使用 XML 来描述二维图形和绘图程序的语言,图像在放大或改变尺寸的情况下其图形质量不会有所损失,是万维网联盟的标准. 下面整 ...
- Canvas文本设置
本文的应用对Canvas文本设置相关属性进行了汇总,具体使用说明请参考下面代码: <!DOCTYPE html> <html lang="zh"> < ...
- ubuntu16.04 无法wifi链接一段时间掉线且无法再连接
ubuntu16.04 无法wifi链接一段时间掉线且无法再连接,从网上搜索的确认这个一个bug. 解决方法: 1.Get details of your PCI wireless card by r ...
- Linux 内核驱动支持什么设备
struct usb_device_id 结构提供了这个驱动支持的一个不同类型 USB 设备的列表. 这个 列表被 USB 核心用来决定给设备哪个驱动, 并且通过热插拔脚本来决定哪个驱动自动加载, 当 ...
- CodeForces 1213F (强联通分量分解+拓扑排序)
传送门 •题意 给你两个数组 p,q ,分别存放 1~n 的某个全排列: 让你根据这两个数组构造一个字符串 S,要求: (1)$\forall i \in [1,n-1],S_{pi}\leq S _ ...
- Visual Studio Team Services使用教程【1】:邀请团队成员
2017.4.23之后建议朋友看下面的帖子 TFS2017 & VSTS 实战(繁体中文视频) Visual Studio Team Services(VSTS)与敏捷开发ALM实战关键报告( ...
- 网络知识_01:ISO七层模型
一 IOS七层模型 1.1OSI的概念 Open System Interconnect开放系统互连参考模型,是由ISO(国际标准化组织)定义的.它是个灵活的.稳健的和可互操作的模型. 1.2OSI模 ...
- 基础之Lamada和Stream的邂逅
show me the code and take to me,做的出来更要说的明白 GitHub项目JavaHouse同步收录 喜欢就点个赞呗! 你的支持是我分享的动力! 引入 是否有遇到看不懂身边 ...
- $AT2292\ Division\ into\ Two$ $dp$
正解:$dp$ 解题报告: 传送门$QwQ$ 不妨令$A\geq B$,于是先$sort$然后预处理判下如果有三个元素两两差都小于$B$的就直接$GG$了. 然后考虑对集合$X$进行$dp$,剩下的数 ...
- 「CH2501」 矩阵距离 解题报告
CH2501 矩阵距离 描述 给定一个N行M列的01矩阵 A,\(A[i][j]\) 与 \(A[k][l]\) 之间的曼哈顿距离定义为: \(dist(A[i][j],A[k][l])=|i-k|+ ...