第二天:给自己做一个在线简历吧

最后的验证,提出了几个问题,尝试解答一下

HTML是什么,HTML5是什么

HTML的定义摘抄自w3school的HTML 简介

HTML 是用来描述网页的一种语言。

  • HTML 指的是超文本标记语言 (Hyper Text Markup Language)
  • HTML 不是一种编程语言,而是一种标记语言 (markup language)
  • 标记语言是一套标记标签 (markup tag)
  • HTML 使用标记标签来描述网页

HTML5的定义也摘抄自w3school的HTML 5 简介

HTML5是下一代的HTML,一个新版本的HTML。

HTML5 的一些规则:

  • 新特性应该基于 HTML、CSS、DOM 以及 JavaScript。
  • 减少对外部插件的需求(比如 Flash)
  • 更优秀的错误处理
  • 更多取代脚本的标记
  • HTML5 应该独立于设备
  • 开发进程应对公众透明

新特性

HTML5 中的一些有趣的新特性:

  • 用于绘画的 canvas 元素
  • 用于媒介回放的 video 和 audio 元素
  • 对本地离线存储的更好的支持
  • 新的特殊内容元素,比如 article、footer、header、nav、section
  • 新的表单控件,比如 calendar、date、time、email、url、search

浏览器支持

最新版本的 Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 将支持某些 HTML5 特性。

HTML元素、标签、属性都是什么概念?

摘抄自HTML简介

HTML 标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

  • HTML 标签是由尖括号包围的关键词,比如 <html>
  • HTML 标签通常是成对出现的,比如 <b></b>
  • 标签对中的第一个标签是开始标签,第二个标签是结束标签
  • 开始和结束标签也被称为开放标签闭合标签

摘抄自HTML 元素

HTML 元素

HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。

摘抄自HTML 属性

属性为 HTML 元素提供附加信息。

HTML 属性

HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息

属性总是以名称/值对的形式出现,比如:name="value"

属性总是在 HTML 元素的开始标签中规定。

文档类型是什么概念,起什么作用?

摘抄自HTML <!DOCTYPE>

概念:

它为浏览器提供一项信息(声明),即 HTML 是用什么版本编写的。

作用:

<!DOCTYPE> 声明帮助浏览器正确地显示网页。

HTML 也有多个不同的版本,只有完全明白页面中使用的确切 HTML 版本,浏览器才能完全正确地显示出 HTML 页面。

meta标签都用来做什么的?

摘抄自HTML <meta> 标签

定义和用法

<meta> 元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。

<meta> 标签位于文档的头部,不包含任何内容。<meta> 标签的属性定义了与文档相关联的名称/值对。

Web语义化是什么,是为了解决什么问题

Web语义化是指使HTML元素有更清晰的语义,例如HTML5的新增内容元素article、footer、header、nav、section。

顾轶灵关于“如何理解 Web 语义化?”的回答提到

什么是语义化?其实简单说来就是让机器可以读懂内容。

摘自维基百科的词条语义化

语义化是前端开发里面的一个专用术语,其优点在于标签语义化有助于构架良好的html结构,有利于搜索引擎的建立索引、抓取;另外,亦有利于页面在不同的设备上显示尽可能相同;此外,亦有利于构建清晰的机构,有利于团队的开发、维护。

从上述的文字中,对语义化解决什么问题,可以简单表述:

  • 使html结构更有序和清晰
  • 利于搜索引擎索引和抓取
  • 利于不同设备的显示
  • 利于团队开发和维护

链接是什么概念,对应什么标签?

摘抄自HTML 链接

超链接可以是一个字,一个词,或者一组词,也可以是一幅图像,您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。

当您把鼠标指针移动到网页中的某个链接上时,箭头会变为一只小手。

我们通过使用<a>标签在 HTML 中创建链接。

有两种使用<a>标签的方式:

1.通过使用 href 属性 - 创建指向另一个文档的链接

2.通过使用 name 属性 - 创建文档内的书签

常用标签都有哪些,都适合用在什么场景

HTML 参考手册-标签列表(功能排序)

表单标签都有哪些,对应着什么功能,都有哪些属性

摘抄自http://www.w3school.com.cn/tags/html_ref_byfunc.asp

表单

标签 描述
<form> 定义供用户输入的 HTML 表单。
<input> 定义输入控件。
<textarea> 定义多行的文本输入控件。
<button> 定义按钮。
<select> 定义选择列表(下拉列表)。
<optgroup> 定义选择列表中相关选项的组合。
<option> 定义选择列表中的选项。
<label> 定义 input 元素的标注。
<fieldset> 定义围绕表单中元素的边框。
<legend> 定义 fieldset 元素的标题。
<isindex> 不赞成使用。定义与文档相关的可搜索索引。
<datalist> 定义下拉列表。
<keygen> 定义生成密钥。
<output> 定义输出的一些类型。

表单属性请查看http://www.w3school.com.cn/html/html_form_attributes.asp

ol, ul, li, dl, dd, dt等这些标签都适合用在什么地方,举个例子

参考自HTML 列表

无序列表始于 <ul> 标签。每个列表项始于 <li>

<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

显示如下

  • Coffee
  • Milk

有序列表始于 <ol> 标签。每个列表项始于 <li> 标签。

<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

显示如下:

  1. Coffee
  2. Milk

自定义列表<dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。

<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>

显示如下:

Coffee

Black hot drink

Milk

White cold drink

ife 零基础学院 day 2的更多相关文章

  1. 结合jquery的前后端加密解密 适用于WebApi的SQL注入过滤器 Web.config中customErrors异常信息配置 ife2018 零基础学院 day 4 ife2018 零基础学院 day 3 ife 零基础学院 day 2 ife 零基础学院 day 1 - 我为什么想学前端

    在一个正常的项目中,登录注册的密码是密文传输到后台服务端的,也就是说,首先前端js对密码做处理,随后再传递到服务端,服务端解密再加密传出到数据库里面.Dotnet已经提供了RSA算法的加解密类库,我们 ...

  2. ife 零基础学院 day 1 - 我为什么想学前端

    与前端结缘   我是后端研发,毕业四年,用了四年C#,一开始写ASP.NET,有时会在asp页面写简单的js和html,做点css样式调整.当时的感触是前端调试太费劲了,因为没有js.html.css ...

  3. ife2018 零基础学院 day 3

    ife2018 零基础学院 第三天:让简历有点色彩 什么是CSS,CSS是如何工作的! 摘自CSS如何工作 什么是CSS CSS是一种用于向用户指定文档如何呈现的语言 - 它们如何被指定样式.布局等. ...

  4. ife2018 零基础学院 day 4

    第四天,背景边框列表链接和更复杂的选择器 背景,边框,列表,链接相关属性 背景 MDN 背景 W3School 背景 元素的背景是指,在元素内容.内边距和边界下层的区域. 属性 描述 backgrou ...

  5. 辛巴学院-Unity-剑英陪你零基础学c#系列(四)函数和封装

    辛巴学院:正大光明的不务正业. 国庆长假结束了,我的心情是这样的: 你总是起不早,起不早独自一个人沉睡到天亮你无怨无悔的梦着那副本我知道你根本就不想上班你总是起不早,起不早放假总是短暂,上班太难请个病 ...

  6. IM开发者的零基础通信技术入门(二):通信交换技术的百年发展史(下)

    1.系列文章引言 1.1 适合谁来阅读? 本系列文章尽量使用最浅显易懂的文字.图片来组织内容,力求通信技术零基础的人群也能看懂.但个人建议,至少稍微了解过网络通信方面的知识后再看,会更有收获.如果您大 ...

  7. 从零基础到拿到网易Java实习offer,谈谈我的学习经验

    微信公众号[程序员江湖] 作者黄小斜,斜杠青年,某985硕士,阿里 Java 研发工程师,于 2018 年秋招拿到 BAT 头条.网易.滴滴等 8 个大厂 offer,目前致力于分享这几年的学习经验. ...

  8. 《iOS开发指南:从零基础到App Store上架(第2版)》

    <iOS开发指南:从零基础到App Store上架(第2版)> 基本信息 作者: 关东升 丛书名: 图灵原创 出版社:人民邮电出版社 ISBN:9787115348029 上架时间:201 ...

  9. 任务五:零基础HTML及CSS编码(二)

    面向人群: 零基础或初学者 难度: 简单 重要说明 百度前端技术学院的课程任务是由百度前端工程师专为对前端不同掌握程度的同学设计.我们尽力保证课程内容的质量以及学习难度的合理性,但即使如此,真正决定课 ...

随机推荐

  1. java集成memcached、redis防止缓存穿透

    下载相关jar,安装Memcached,安装教程:http://www.runoob.com/memcached/memcached-install.html spring配置memcached &l ...

  2. WordPress自动裁剪768w像素缩略图的解决办法

    最新观赏鱼在折腾一个新的WordPress站点,即使通过后台把多媒体裁剪的宽高都设置为0时,移除主题可能存在的自动裁剪大小,WordPress依然会在上传图片的时候自动裁剪一个宽为768像素的图片.并 ...

  3. autium designer smart pdf一个小问题

    今天在使用ad的smart  pdf时遇到一个小问题  就是 使用的是AD17,生成PDF,PDF没有把芯片的引脚标号显示出来(还有其它的芯片也是一样的,但是奇怪的是:只有在原理图元器件右边的没有显示 ...

  4. Redhat/CentOS7-环境虚拟机简单搭建Nginx+Tomcat负载均衡集群

    Tomcat服务器是一个免费的开放源代码的web应用服务器,属于轻量级应用服务器,是开发和调试JSP程序的首选.由于Tomcat处理静态HTML的能力运不及Apache或者Nginx,所以Tomcat ...

  5. 【转载】sql monitor

    来自 “ ITPUB博客 ” ,链接:http://blog.itpub.net/27067062/viewspace-2129635/ SQL Monitor Report 1. SQL Monit ...

  6. JavaScript视频分享,学无止境。

    http://blog.sina.com.cn/s/blog_735ed39a0102voy3.html

  7. 卷积神经网络中的channel 和filter

    在深度学习的算法学习中,都会提到 channels 这个概念.在一般的深度学习框架的 conv2d 中,如 tensorflow .mxnet,channels 都是必填的一个参数. channels ...

  8. 背水一战 Windows 10 (106) - 通知(Toast): 通过 toast 打开协议, 通过 toast 选择在指定的时间之后延迟提醒或者取消延迟提醒

    [源码下载] 背水一战 Windows 10 (106) - 通知(Toast): 通过 toast 打开协议, 通过 toast 选择在指定的时间之后延迟提醒或者取消延迟提醒 作者:webabcd ...

  9. 解决mysql插入数据报错[Err] 1146 - Table 'performance_schema.session_status' doesn't exist

    解决办法:1.打开cmd 执行命令cd/ 进入C盘根目录2.dir 查看C盘根目录下文件夹  找到 Program Files文件夹3.cd Program Files 进入该文件夹下 再输入dir ...

  10. 项目文件与 SVN 资源库同步提示错误 Attempted to lock an already-locked dir

    问题描述 之前为了图方便,在eclipse中直接把三个jsp文件复制到了eclipse中我新建的一个文件夹中,把svn版本号信息也带过来了,然后我又删除了这三个jsp文件,接着先把这三个jsp复制到桌 ...