前端知识介绍

<!DOCTYPE html><html lang="en"><head>    <!--meta是自闭合标签    属性:name="keywords"              描述网站的关键字    属性name="description"             网站内容的大致描述    属性http-equiv="Refresh"           刷新网站    -->    <!--<meta name="keywords",-->          <!--content="网站关键字">-->

<!--<meta name="description"-->          <!--content="网站描述">-->

<!--2秒钟后跳转到www.baidu.com,如果不添加网站则没2秒钟刷新一次网站-->    <!--<meta http-equiv="refresh"-->          <!--content="2;URL=https://www.baidu.com">-->

<!--<meta http-equiv="refresh"-->          <!--content="2">-->

<!--定义文档编码方式-->    <meta http-equiv="content-type" charset="UTF-8">    <!--IE浏览器专用定义兼容模式-->    <!--<meta http-equiv="X-UA-COMPATIBLE" CONTENT="IE-EmulateIE7">-->    <!--网站显示名称-->

<title>抽屉测试页面</title>

<!--网站图标icon设置-->    <link rel="icon" href="chouti.ico">

<!--css和js代码也放到head标签里面-->    <!--css代码第二种方式-->    <style>        /*div{*/            /*color: red;*/            /*background: green;*/        /*}*/        /*span{*/            /*color: green;*/            /*background: indianred;*/        /*}*/        #div1{            height: 500px;            background: orange;        }        #div2{            height: 600px;            background: orangered;        }        #div3{            height: 700px;            background: coral;        }    </style>    <script></script>

</head><body>    <!--h标签是块标签-->    <!--<h1>This is H1...</h1>-->    <!--<h2>This is H2...</h2>-->    <!--<h3>This is H3...</h3>-->    <!--<h4>This is H4...</h4>-->    <!--<h5>This is H5...</h5>-->    <!--<h6>This is H6...</h6>-->

<!--br标签是in-line标签-->                <!--将进酒·君不见<br><hr>-->    <!--君不见,黄河之水天上来,奔流到海不复回。<br><hr>-->    <!--君不见,高堂明镜悲白发,朝如青丝暮成雪。<br><hr>-->    <!--人生得意须尽欢,莫使金樽空对月。<br><hr>-->    <!--天生我材必有用,千金散尽还复来。<br><hr>-->

<!--div标签无任何text渲染,css代码第一种方式    div是块级标签,独占一行    -->    <!--<div style="color: red;">Hello div...!</div>-->    <!--Hello Before-->    <!--<div>Hello div1...</div><div>hello div2...</div>Hello After-->

<!--span标签与div标签一样,无任何text渲染,css代码第一种方式-->    <!--<span style="color: greenyellow;">Hello span!</span>    span标签是内联标签,    -->    <!--<span>Hello span!</span>-->

<!--所有的标签都可以划分到块级标签和内联标签两类里面-->

<!--p标签也是块级标签,换行和隔行的作用,其他与div类似-->    <!--<p>hello p1...</p> <p>hello p2...</p>-->    <!--<p>-->        <!--以下标签以后都用css替代-->        <!--<b>b标签给字体加粗</b>-->        <!--<em>em标签将字体变成斜体</em>-->        <!--<strike>strike给字体添加删除线</strike>-->        <!--<del>del标签与strike标签一样</del>-->        <!--s<sub>3</sub>-->        <!--s<sup>3</sup>-->        <!--&nbsp;代表空格&copy;代表版权符号&lt小于&gt大于-->        <!--Hello&nbsp;&nbsp;World!&copy;&lt;h1&gt;-->    <!--</p>-->

<!--img标签显示图片    src属性控制路径,    width控制长度,    height控制高度    alt属性控制加载失败后的提示内容,    title属性控制光标悬浮状态下的显示内容    -->    <!--<img src="美女1.jpg"-->         <!--width="500px"-->         <!--height="700"-->         <!--alt="美女"-->         <!--title="美女"-->    <!--&gt;-->

<!--<p></p>-->    <!--a标签提供的功能之一是:超链接,另一个重要的功能是锚    href属性控制超链接地址以及要定位的其他页面    target属性控制新窗口跳转    没有target属性则表示本地跳转    -->

<!--<a href="https://www.jd.com" target="_blank">-->        <!--<b>京东</b>-->    <!--</a>-->    <!--<a href="https://www.jd.com">-->        <!--<b>京东</b>-->    <!--</a>-->    <!--<div id="div_top">Top</div>-->    <!--<a href="#div1">第一章</a>-->    <!--<a href="#div2">第二章</a>-->    <!--<a href="#div3">第三章</a>-->

<!--<div id="div1">第一章</div><a href="#div_top">返回</a>-->    <!--<div id="div2">第二章</div><a href="#div_top">返回</a>-->    <!--<div id="div3">第三章</div><a href="#div_top">返回</a>-->

<!--ul:不排序标签,ul标签里面固定嵌套li标签-->    <!--<ul>-->        <!--<li>1</li>-->        <!--<li>2</li>-->        <!--<li>3</li>-->    <!--</ul>-->

<!--ol: 排序标签,ol标签里面也固定嵌套li标签-->    <!--<ol>-->        <!--<li>1</li>-->        <!--<li>2</li>-->        <!--<li>3</li>-->    <!--</ol>-->

<!--dl: 定义列表    dt: 标题    dd: 数据    -->    <!--<dl>-->        <!--<dt>第一章</dt>-->        <!--<dd>content</dd>-->        <!--<dt>第二章</dt>-->        <!--<dd>content</dd>-->    <!--</dl>-->

<!--form表单用户向服务器传送数据    method属性控制客户端向服务端提交数据的方式            get方式提交的键值对,放在地址栏url,提交的内容长度有限制,安全性相对较差            post方式提交的键值对,放在请求体里面,安全性相对较高,提交的内容长度理论上没有限制            这两种提交方式在服务器端都是字典的形式接收,一般form表单提交都是以post方式    action属性控制提交的目的地址    -->    <!--<form action="127.0.0.1:8080/index" method="get">-->        <!--input标签是自闭合标签        type属性控制输入的类型        name属性是提交给服务器的        -->        <!--<p>输入框名称:<input type="text"></p>-->        <!--<p>姓名:<input type="text" name="username"></p>-->        <!--<p>密码:<input type="password" name="password"></p>-->        <!--<p>爱好:篮球<input type="checkbox" name="hobby" value="1">-->                <!--足球<input type="checkbox" name="hobby" value="2"></p>-->        <!--<p>性别:男<input type="radio" name="gender">-->                <!--女<input type="radio" name="gender"></p>-->        <!--<p>所在城市:-->            <!--<select name="city" multiple="multiple" size="5">-->                <!--<optgroup label="北京">-->                    <!--<option value="chaoyang">朝阳</option>-->                    <!--<option value="chaoyang">海淀</option>-->                    <!--<option value="chaoyang">东城</option>-->                    <!--<option value="chaoyang">西城</option>-->                <!--</optgroup>-->                <!--<optgroup label="湖南">-->                    <!--<option value="changsha">长沙</option>-->                    <!--<option value="yueyang">岳阳</option>-->                    <!--<option value="zhuzhou">株洲</option>-->                    <!--<option value="xiangtan">湘潭</option>-->                <!--</optgroup>-->            <!--</select>-->        <!--</p>-->        <!--<p>自我简介:-->            <!--<textarea rows="10" cols="50">正文</textarea>-->            <!--<label for="qualifications">学历</label>-->            <!--<input id="qualifications" type="text">-->            <!--<label for="school">学校</label>-->            <!--<input id="school" type="text">-->        <!--</p>-->        <!--<p>证件:<input type="file"></p>-->        <!--<p>重置:<input type="reset" value="reset"></p>-->        <!--<p>提交:<input type="submit" value="press"></p>-->        <!--<p>提交:<input type="button" value="button由js中的事件触发"></p>-->    <!--</form>-->

</body></html>
时间: 2024-08-28 04:00:02

前端知识介绍的相关文章

Web 前端知识体系精简

Web前端技术由html.css和javascript三大部分构成,是一个庞大而复杂的技术体系,其复杂程度不低于任何一门后端语言.而我们在学习它的时候往往是先从某一个点切入,然后不断地接触和学习新的知识点,因此对于初学者很难理清楚整个体系的脉络结构.本文将对Web前端知识体系进行简单的梳理,对应的每个知识点点到为止,不作详细介绍.目的是帮助大家审查自己的知识结构是否完善,如有遗漏或不正确的地方,希望共勉. JAVASCRIPT 篇 0.基础语法 Javascript基础语法包括:变量定义.数据类

前端知识体系之入门篇总结(一)

利用国庆节时间,把前端学习的知识碎片进行了整理,希望能在前端之路继续努力. 前端是一个范围很大的概念,其领域包括在了计算系统中的方方面面,可以说所有与用户交互行为相关的程序开发工作都是前端的范围,这包括一个数字仪表的显示设计或者一个手机APP.通常意义上讲,前端指的是Web前端的开发工作,而学习前端也是从Web前端知识开始的. 这篇blog面向对前端没有入门或者已经有一定的网页编码技术但对于前端知识体系没有一个清晰条理的开发者,其要旨是整理一个普通网页开发过程中所能用到的知识点.与其它类似的教程

Web前端知识体系精简

Web前端技术由html.css和javascript三大部分构成,是一个庞大而复杂的技术体系,其复杂程度不低于任何一门后端语言.而我们在学习它的时候往往是先从某一个点切入,然后不断地接触和学习新的知识点,因此对于初学者很难理清楚整个体系的脉络结构.本文将对Web前端知识体系进行简单的梳理,对应的每个知识点点到为止,不作详细介绍.目的是帮助大家审查自己的知识结构是否完善,如有遗漏或不正确的地方,希望共勉. JAVASCRIPT 篇 0.基础语法 Javascript基础语法包括:变量定义.数据类

前端知识体系2

Raw Blame History 1226 lines (983 sloc) 67.4 KB QQ联盟群交流(492107297)群规 GITHUB在线地址 http://t.cn/RL2NtqX 看云在线地址 http://t.cn/RUdaGHn 这是我们联盟群的组织结构,加入等级参考JS高级前端开发群加群说明. 这本来是我QQ群内部的一份公共约定的日常交流规则,后来得到大伙的一致认可,并用实际行动来捍卫它,使我倍受感动. 后来想:传播使爱更有力量,阅读使内心更为坚强,沉淀使生活更为醇香,

向着全栈工程师前进!Web前端知识体系精简

Web前端技术由html.CSS和JavaScript三大部分构成,是一个庞大而复杂的技术体系,其复杂程度不低于任何一门后端语言.而我们在学习它的时候往往是先从某一个点切入,然后不断地接触和学习新的知识点,因此对于初学者很难理清楚整个体系的脉络结构.本文将对Web前端知识体系进行简单的梳理,对应的每个知识点点到为止,不作详细介绍.目的是帮助大家审查自己的知识结构是否完善,如有遗漏或不正确的地方,希望共勉. JAVASCRIPT 篇 重点:爱创课堂8月份web前端培训课程就要开课: 特针对零基础开

前端知识体系及修炼攻略

Web前端开发工程师是一个很新的职业,在国内乃至国际上真正开始受到重视的时间不超过5年.Web前端开发是从网页制作演变而来的,名称上有很明显的时代特征.随着人们对用户体验的要求越来越高,前端开发的技术难度越来越大,Web前端开发工程师这一职业终于从设计和制作不分的局面中独立出来. 早期的前端其实就是Table布局,后来发展到所谓的Div + CSS网站重构,再到现在的让人眼花缭乱的各种各样的新技术,Web前端技术发展是非常快速的,因此选择了前端这个行业就意味着不停的学习吧.让我们先看看张克军绘制

前端知识图谱

综合类 前端知识体系 前端知识结构 Web前端开发大系概览 Web前端开发大系概览-中文版 Web Front-end Stack v2.2 免费的编程中文书籍索引 前端书籍 前端免费书籍大全 前端知识体系 免费的编程中文书籍索引 智能社 - 精通JavaScript开发 重新介绍 JavaScript(JS 教程) 麻省理工学院公开课:计算机科学及编程导论 JavaScript中的this陷阱的最全收集–没有之一 JS函数式编程指南 JavaScript Promise迷你书(中文版) 腾讯移

JS前端知识模块大全

公司前端:小胖提供,表示感谢 1. 基础 HTML, CSS, JS 文档 W3CSCHOOL: http://www.w3schools.com/ MDN: https://developer.mozilla.org/zh-CN/ w3school:http://www.w3school.com.cn/ 个人更倾向于使用MDN. w3cschool貌似被墙 Html中学习语义化, 正确的结构, meta标签等. 了解各种属性用途. 例如data-*(html5新增数据属性), aria-*(帮

Web前端知识体系

Web前端技术由html.css和javascript三大部分构成,是一个庞大而复杂的技术体系,其复杂程度不低于任何一门后端语言.而我们在学习它的时候往往是先从某一个点切入,然后不断地接触和学习新的知识点,因此对于初学者很难理清楚整个体系的脉络结构.本文将对Web前端知识体系进行简单的梳理,对应的每个知识点点到为止,不作详细介绍.目的是帮助大家审查自己的知识结构是否完善,如有遗漏或不正确的地方,希望共勉. JAVASCRIPT 篇 0.基础语法 Javascript基础语法包括:变量定义.数据类