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)的更多相关文章

  1. CSS知识点集锦

      CSS知识点集锦 CreateTime--2016年9月29日09:43:10Author:Marydon UpdateTime--2017年3月21日08:03:13 2.CSS样式优先级问题 ...

  2. 这些HTML、CSS知识点,面试和平时开发都需要 No1-No4

    系列知识点汇总 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5-No7(知识 ...

  3. 这些HTML、CSS知识点,面试和平时开发都需要 No5-No7

    系列知识点汇总 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5-No7(知识 ...

  4. 这些HTML、CSS知识点,面试和平时开发都需要 No8-No9

    系列知识点汇总 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5-No7(知识 ...

  5. 这些HTML、CSS知识点,面试和平时开发都需要 No10-No11

    系列知识点汇总 1.基础篇 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5- ...

  6. css知识点

    css知识点 一.盒模型知识 border: 边框 border-width:边框的宽度 border-color:边框的颜色 border-style:边框的线型 border-top:上边框 bo ...

  7. Spring知识点回顾(01)Java Config

    Spring知识点回顾(01) 一.Java Config 1.服务和服务注入 2.Java 注解 :功能更强一些 3.测试验证 二.注解注入 1.服务和服务注入 2.配置加载 3.测试验证 三.总结 ...

  8. 这些HTML、CSS知识点,面试和平时开发都需要 No8-No9(知识点:媒体操作、构建表单)

    系列知识点汇总 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5-No7(知识 ...

  9. 这些HTML、CSS知识点,面试和平时开发都需要 No10-No11(知识点:表格操作、代码编写规则)

    系列知识点汇总 1.基础篇 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5- ...

随机推荐

  1. ubuntu中桌面图标的配置

    在网上随处可以找到怎么样把应用程序的图标放到桌面上,我刚用ubuntu时也是按照网上的做法,一步一步的做的,现将网上的做法复制下来: 桌面配置文件简述\label{sec:desktop file} ...

  2. Ubuntu Kylin 14.04安装

    早听说Ubuntu Kylin对中国本地做了很多定制的工作,想搜狗输入法.WPS,还有中国日历等.昨天没事就下载了一个Kylin试用了下,使用的方法还是使用EasyBCD软件做了个硬盘安装启动,关于E ...

  3. 2018-2-13-win10-uwp-获取指定的文件-AQS

    title author date CreateTime categories win10 uwp 获取指定的文件 AQS lindexi 2018-2-13 17:23:3 +0800 2018-2 ...

  4. linux oops 消息

    大部分 bug 以解引用 NULL 指针或者使用其他不正确指针值来表现自己的. 此类 bug 通 常的输出是一个 oops 消息. 处理器使用的任何地址几乎都是一个虚拟地址, 通过一个复杂的页表结构映 ...

  5. 2018-2-13-win10-uwp-异步进度条

    title author date CreateTime categories win10 uwp 异步进度条 lindexi 2018-2-13 17:23:3 +0800 2018-2-13 17 ...

  6. vue-learning:4-template-v-if-and-v-show

    控制元素可见性的指令 v-if 和 v-show v-if v-else v-else-if :多重判断 template :分组渲染包裹元素 key:管理可复用元素 v-show v-if与v-sh ...

  7. 网上做题随笔--MySql

    网上写写题 提高下自己的能力. Mysql平时写的是真的很少,所以训练一下下. 1.查找重复的电子邮箱 https://leetcode-cn.com/problems/duplicate-email ...

  8. 查看当前android设备已安装的第三方包

    查看当前android设备已安装的第三方包 adb shell pm list package -3 2        adb shell "getprop ro.build.version ...

  9. slim的简单使用

    1.在命令行进入项目根目录,然后用composer下载slim composer require slim/slim "^3.0" 2.下载slim完成后,在php文件中引入req ...

  10. The first day of Crawler learning

    使用BeautifulSoup解析网页 Soup = BeautifulSoup(urlopen(html),'lxml') Soup为汤,html为食材,lxml为菜谱 from bs4 impor ...