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. [转]WebApi 后端文件传输至远程服务器

    /* 功能说明:微信退款需要有数字证书,而我们公司是做小程序平台的,会帮商家自动退款,所以会要求商家把微信证书上传至我们服务器,以便 微信退款. 使用HttpPostedFile 接受前端上传的文件, ...

  2. Java发送邮件Demo

    就是个Demo,有使用Spring的东西 package xxxxxxx.common.utils; import org.springframework.mail.javamail.JavaMail ...

  3. WPF 元素裁剪 Clip 属性

    本文介绍如何在 WPF 使用 Clip 裁剪元素 在 WPF 的 UIElement 提供了 Clip 属性,这个属性默认是空,但是如果设置了这个属性就会对元素进行裁剪 这个属性是一个 Geometr ...

  4. 如何更优雅地对接第三方API

    本文所有示例完整代码地址:https://github.com/yu-linfeng/BlogRepositories/tree/master/repositories/third 我们在日常开发过程 ...

  5. KAFKA报错:COMMIT CANNOT BE COMPLETED SINCE THE GROUP HAS ALREADY REBALANCED AND ASSIGNED THE PARTITIONS TO ANOTHER MEMBER

    转载:https://www.greenhtml.com/archives/Commit-cannot-be-completed-since-the-group-has-already-rebalan ...

  6. 阿里巴巴java开发手册学习记录,php版

    一.编程规约 (一)命名风格 1.目录使用小写+下划线 home,view,model,admin_view 2.类 UpperCamelCase PhpMailer方法 lowerCamelCase ...

  7. Linux基础:认识Linux

    1.Linux操作系统的特点 优点 ​ (1)可靠性高:linux是基于Unix的概念开发出来的系统,拥有Unix的稳定且效率的特点.运行一年以上而不曾宕机.不必关机是很平常的事情 : ​ (2)彻底 ...

  8. Typescript 最佳实践

    文章列表: <一>大话 TypeScript 基本类型 <二>大话 Typescript 枚举 <三>大话 Typescript 接口 <四>大话 Ty ...

  9. golang实现依赖注入

    golang实现依赖注入 依赖注入是软件工程中经常使用到的一种技术,它提供了一种控制反转的机制,把控制权利交给了调用方.调用方来决定使用哪些参数,哪些对象来进行具体的业务逻辑. 它有几个好处: 1 它 ...

  10. MyISAM与InnoDB的索引实现区别

    一 MyISAM索引实现 1. 主键索引 MyISAM引擎使用B+树作为索引结果,叶节点的data域存放的是数据记录的地址.下图为MyISAM表的主索引,Col1为主键. 2. 辅助索引 在MyISA ...