传智播客前端就业班学习笔记(标签)

43人阅读 评论(0) 收藏 举报

声明:此博客仅为记载前端学习之路上的心得体会。在记录的过程还会有许多不足之处,希望大家给出意见,一起交流进步。大佬勿喷。

视频:传智播客web前端14期(就业班)

工具:sublime text 3(文末附有下载地址)

接下来开始正题

    首先web共有三个标准,它们分别为 html,CSS,JS

   Html  结构标准 相当于人的身体

   CSS   表现标准 相当于给人化妆,变得更漂亮

    js    行为标准 相当于人在唱歌,页面更灵动

HTML:超文本传输语言,通过浏览器向用户传达信息。

HML结构标准

<doctype html> 

<html>  
<head>  
<title></title> 
</head>
<body>  
</body>
</html>


其中:<!DOCTYPE> 声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令

       <head> 标签用于定义文档的头部,它是所有头部元素的容器。<head> 中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。

        <title>标签用于向用户显示浏览器标题

         <body >元素包含文档的所有内容(比如文本、超链接、图像、表格和列表等等。)

HTml标签分类
单标签:<!doctype html>
双标签:<html></html>  <head></head>   <title></tltle>
HTml标签关系分类
包含(嵌套关系) <head><title></tltle></head>   父子

并列关系 <head></head><bady></body> 兄弟姐妹

介绍几个常用标签

注释标签

<!-- CSDN专业IT社区 -->

浏览器不会显示注释标签中的内容。加注释是为了方便日后的代码管理,在以后的工作中给客户或管理人员观看。

换行标签

<body>
CSDN专业IT社区<br>
CSDN专业IT社区
</body>

加入br标签后浏览器效果

未加入br标签效果

下划线标签

<body>
CSDN专业IT社区<br>
CSDN专业IT社区
</body>

浏览器运行效果图

段落标签

<body>
<p>CSDN专业IT社区</p>
<p>CSDN专业IT社区</p>
</body>

浏览器运行效果图

特点:自动生成空白行。<br/>标签不会生成空白行

标题标签(h1-h6)

<body>
<h1>CSDN专业IT社区</h1>
<h2>CSDN专业IT社区</h2>
<h3>CSDN专业IT社区</h3>
<h4>CSDN专业IT社区</h4>
<h5>CSDN专业IT社区</h5>
<h6>CSDN专业IT社区</h6>
</body>

浏览器运行效果图

<font> 规定文本的字体、字体尺寸、字体颜色。

<body>
<font size="3" color="red">CSDN专业IT社区</font><br>
<font size="2" color="blue">CSDN专业IT社区</font><br>
<font face="verdana" color="green">CSDN专业IT社区</font><br>
</body>

浏览器运行效果


文本格式化标签

<body>
<!-- 文本格式化标签 -->
<!-- 加粗标签:尽量使用strong -->
<strong>前端工程师</strong><br>
<b>前端工程师</b><br>
<!-- 文本倾斜标签:尽量使用em -->
<em>前端工程师</em><br>
<i>前端工程师</i><br>
<!-- 删除线标签:尽量使用del -->
<del>1680.3</del><br>
<s>1680.3</s><br>
<!-- 下划线标签:尽量使用ins -->
<ins>前端工程师</ins><br>
<u>前端工程师</u><br>
</body>

浏览器运行效果图


注:推荐上述标签,标签名称具有语义化,方便记忆

sublime Text 3下载地址:链接:https://pan.baidu.com/s/12uWUOC8ZhAiT4dU7K7x3zA 密码:60pf







         


查看评论

javaScript-高级面向对象视频教程

-
  • 1970年01月01日 08:00

传智播客web前端就业班

  • 2018年01月05日 18:39
  • 49B
  • 下载

传智播客2016年9月份Web前端就业班视频全集百度云链接

  • 2018年01月24日 23:21
  • 49B
  • 下载

传智播客-Java学习笔记day23

1.多线程程序的引入 红色代表一个执行的流程,线程   2.进程概述及多进程的意义     A:要想了解多线程,必须先了解线程,而要想了解线程,必须先了解进程,因为...
  • x380481791
  • x380481791
  • 2017-07-31 17:00:59
  • 183

前端就业班全套视频教程 前端html+css基本功合集

妙味课堂前端之html+css基础视频教程 妙味前端基础教程 html+css视频HTML5开发视频教程 极客学院新版HTML5视频培训2016 达内前端全套视频教程 Web前端教程 前端重如入门到精...
  • alt1993
  • alt1993
  • 2018-02-21 12:35:07
  • 104

传智播客Web大前端-北京1期

  • 2017年11月21日 11:34
  • 48B
  • 下载

2016web前端与移动开发就业班全套

2016web前端与移动开发就业班全套
  • wanglei20122012
  • wanglei20122012
  • 2016-08-29 21:42:39
  • 572

最新前端视频就业班

  • 2018年03月17日 21:43
  • 47B
  • 下载

传智播客2017基础班就业班视频课件资料

  • 2017年09月08日 23:24
  • 49B
  • 下载

传智播客 2018最新前端就业班视频教程全套

  • 2018年04月05日 08:38
  • 65B
  • 下载
    个人资料
    等级:
    访问量: 0
    积分: 20
    排名: 0
    文章分类
    文章存档