1. 基础模板

       <!DOCTYPE html>

       <html>

           <head>

               <meta charert="utf-8" />

               <title>第一个页面</title>

           </head>

           <body>

               day01

               第一个页面

           </body>

       </html>

2. 模板解读

   - <DOCTYPE>：指定文档类型，是文档声明，必须写在html文档的第一行，位于<html>标签之前，表明该文档是html5标签，规定html标签语法。

   - <html>：文档根标签，标注着文档（页面）的开始与结束。

     html的lang属性可用于网页或部分网页的语言。通常用于搜索引擎和浏览器的统计分析，不定义也没有什么影响。

     根据W3C推荐标准，您应该通过<html>标签中的 lang 属性对每张页面中的主要语言进行声明，比如：

         <html lang="en"></html>

   - <head>：文档的开头，可以引用脚本文件、指定样式表、书写逻辑代码块、提供元素信息。包含了文档的与智能数据（meta），如<meta charert="utf-8" /> 定义网页编码格式为utf-8。

   - body：文档主体标签，包含文档所有文本与从超文本内容

   - title：文档tag标题标签，设置文档tag的标题内容

3. meta(元标签)

       字符编码

       <meta charset="utf-8">

       <meta http-equiv="content-type"

       conntent ="text/html;charset=utf-8"/>

       SEO

       <meta name="keyword" content="8到12个以英文逗号隔开的单词或词语">

       <meta name="descreption" content="80字以内的一段话，与网站内容相关">

       移动适配

       <meta name="viveport" content="width=device,initial-scale=1,minium-scale=1,user-scaleble=no"/>

4. html标签纤细语法与注意点

   - 标签的语法：

     <标签名  属性1=“值1” 属性2=“值2”........>内容部分</标签名>

     <标签名  属性1=“值1” 属性2=“值2”........./>

5. html标签分类及语义

       1. <br> :换行

       2. <hr> :分割线

       3. <font> :修改文字大小,颜色

           <font color="red" size="10px">岂能尽如人意</font>

       4. <u> :下划线

       5. <i> :倾斜

       6. <s> :下划线

       6. <b> :加粗

           <b>论颜值，我秒杀宇宙</b>

6. 字符实体

   html特殊符号对照表

   注意:实体名称对大小写敏感

     内容      代码

     空格      &nbsp;

     >       &gt;

     <       &lt;

     &       &amp;

     ¥       &yen;

     版权      &copy;

     注册      &reg;

7. h系列标签

   语义:标记内容为一个标题，全称headline

   h系列标签从h1-h6共6个，没有h7标签，标记内容为1~6级标题，h1用作主标题（代表最重要的），其实是h2。。。

   虽然h1-h6标签的显示样式是从大到小，但再次强调：记忆HTML标签的显示样式是没有意义的

       <!DOCTYPE HTML>

       <html>

           <head lang='en'>

               <meta charset="utf-8">

               <title>Egon才华无敌</title>

           </head>

           <body>

               <h1>一级标题</h1><h2>二级标题</h2>

               <h3>三级标题</h3>

               <h4>四级标题</h4>

               <h5>五级标题</h5>

               <h6>六级标题</h6>

               <h7>没有七级标题</h7>

               没有七级标题

           </body>

       </html>

8. p标签

   语义:标记内容为一个段落,全程paragraph

       <!DOCTYPE HTML>

       <html>

           <head lang='en'>

               <meta charset="utf-8">

               <title>Egon无敌</title>

           </head>

           <body>

               <h1>Egon</h1>

               <p>论颜值，鹤立鸡群</p>

               <p>论才华，天下无敌</p>

           </body>

       </html>

前端html/css/script基础的更多相关文章

  1. 前端工程师面试问题归纳（一、问答类html/css/js基础）

    一.参考资源 1.前端面试题及答案整理(一) 2.2017年前端面试题整理汇总100题 3.2018最新Web前端经典面试试题及答案 4.[javascript常见面试题]常见前端面试题及答案 5.W ...

  2. WEB前端开发CSS基础样式全面总结

    Web前端开发css基础样式全面总结 颜色和单位的使用 颜色 用颜色的名字表示颜色,比如:red 用16进制表示演示 比如:#FF0000 用rgb数值表示颜色,rgb(红,绿,蓝),每个值都在0-2 ...

  3. 【笔记-前端】div+css排版基础，以及错误记录

    现在的网站对于前端的排版已经逐渐不使用<table>,而是使用div+css. 使用这种方法的最大好处就在于在维护页面时,可以只维护css而不去改动html. 可是这种方式对于初学者来说可 ...

  4. 前端之CSS基础

    前端之CSS 1. CSS CSS定义如何显示HTML元素. 当浏览器读到一个样式表,他就会按照这个样式表来对文档进行格式化(渲染). 3.CSS语法 1)CSS实例 每个CSS由两部分组成: 选择器 ...

  5. 前端之css

    前端之css 本节内容 css概述及引入 css选择器 css常用属性 1.css概述及引入 CSS概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,用来控制网页数 ...

  6. 2天驾驭DIV+CSS （基础篇）（转）

    这是去年看到的一片文章,感觉在我的学习中,有不少的影响.于是把它分享给想很快了解css的兄弟们. 基础篇[知识一] “DIV+CSS” 的叫法是不准确的[知识二] “DIV+CSS” 将你引入两大误区 ...

  7. 第二篇：web之前端之css

    前端之css   前端之css 本节内容 css概述及引入 css选择器 css常用属性 1.css概述及引入 CSS概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式 ...

  8. 我的前端之旅--SeaJs基础和spm编译工具运用[图文]

    标签:seajs   nodejs   npm   spm   js 1. 概述 本文章来源于本人在项目的实际应用中写下的记录.因初期在安装和使用Seajs和SPM的时候,有点不知所措的经历.为此,我 ...

  9. [转]前端利器：SASS基础与Compass入门

    [转]前端利器:SASS基础与Compass入门 SASS是Syntactically Awesome Stylesheete Sass的缩写,它是css的一个开发工具,提供了很多便利和简单的语法,让 ...

随机推荐

  1. numpy.meshgrid()理解

    本文的目的是记录meshgrid()的理解过程: step1. 通过一个示例引入创建网格点矩阵; step2. 基于步骤1,说明meshgrid()的作用; step3. 详细解读meshgrid() ...

  2. 【Objective-C】03-第一个OC程序

    一.打开Xcode,新建Xcode项目 二.选择最简单的命令行项目 因为我们只是学习OC语法,还未正式进入iOS开发,所以选择命令行项目即可 三.输入项目名称,选择Foundation框架进行创建项目 ...

  3. 解决：std::ostream operator<< should have been declared inside 'xxx'

    用VS的NMAKE构建,不会报错,但是用GNU MAKE构建,就会报错.(尝试删除Toast.h中第24行的声明) 因此在遇到类似的情况的时候,记得不仅class里面要有friend声明,namesp ...

  4. Highcharts 图表js框架

    纯js图表框架 ,图表传入Json数据 设置等等   , 如没特定要求可以考虑使用   优点 : 减轻服务器脚本运行负重  ,纯js执行,特效   缺点: 已知兼容性不高 帮助地址: http://w ...

  5. 玩转Win10的45个快捷键

    1Win10快捷键大全(第一部分) Win10发布已经快两个星期了,各项新功能也让小伙伴们兴奋不已.和之前系统一样,Win10也加入了很多经典的快捷键,同时还加入了全新触控手势.今天小编就将所有的Wi ...

  6. 解决微信小程序中Date.parse()获取时间戳IOS不兼容的问题(IOS为NaN的问题)

    前端同事在做微信小程序时发现IOS获取的时间戳为空的问题,后来通过跟踪发现,原来是因为IOS系统不支持2017-01-01格式的时间导致的, var mydata = '2017-01-01 11:0 ...

  7. php ocket通信机制

    php 实例说明 socket通信机制 一,socket是什么 什么是socket 所谓socket通常也称作"套接字",用于描述IP地址和端口,是一个通信链的句柄.应用程序通常通 ...

  8. 在HTML5中如何提高网站前端性能

    1.    用web storage替换cookiesCookie最大的问题是每次都会跟在请求后面.在HTML5中,用sessionStorage和localStorage把用户数据直接在客户端,这样 ...

  9. HashMap与TreeMap的区别？

    HashMap与TreeMap的区别? 解答:HashMap通过hashcode对其内容进行快速查找,而TreeMap中所有的元素都保持着某种固定的顺序,如果你需要得到一个有序的结果你就应该使用Tre ...

  10. sql server 2008安装要求

    sql server 2008安装要求 新部署的R2需要被安装在格式化为NTFS格式的磁盘上: 微软的.NET Framework 3.5 SP1 微软Windows Installer 4.5或以上 ...