整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

简单整理一下以英文字母命名或者开头的语言


单整理一下以英文字母命名或者开头的语言,可能命名方式不是很严谨,但只是整理一下,了解一下之前从未听过但是存在的语言。这里大部分统一以字母命名比如 汇编语言英文名为Assembly Language 第一个字母为A所以统一命名、归类为A语言或者语言名字第一个汉字拼音的第一字母相同命名为这字母的语言,比如Y语言的 雅琪MIS。请不要纠结命名方式了。26个字母中除了字母I、N、T、U没有找到对应的语言其他字母基本有对应的语言或者脚本语言。

A 语言

1、Assembly Language 汇编语言;汇编语言 (面向机器的程序设计语言)汇编语言(assembly language)是一种用于电子计算机、微处理器、微控制器或其他可编程器件的低级语言,亦称为符号语言。在汇编语言中,用助记符代替机器指令的操作码,用地址符号或标号代替指令或操作数的地址。在不同的设备中,汇编语言对应着不同的机器语言指令集,通过汇编过程转换成机器指令。特定的汇编语言和特定的机器语言指令集是一一对应的,不同平台之间不可直接移植。2、ALGOL是算法语言(ALGOrithmic Language)的简称,是在计算机发展史上首次清晰定义的高级语言,由欧美计算机学家合力所组成的联席大会于仍是晶体管计算机流行的1950年代所开发。国际计算机学会(ACM)将ALGOL模式列为算法描述的标准,启发ALGOL类现代语言Pascal、Ada、C语言等出现。

B语言

1、BCPL(Basic Combined Programming Language)1967年,剑桥大学的Martin Richards对CPL语言进行了简化,于是产生了BCPL(Basic Combined Programming Language)语言。B语言是贝尔实验室开发的一种通用的程序设计语言,它是于1969年前后由美国贝尔实验室的电脑科学家肯·汤普逊(Ken Thompson)在丹尼斯·里奇(Dennis Ritchie)的支持下设计出来。后来,丹尼斯·利奇以B语言为基础开发出C语言——世界上最常用的程序语言之一。自从被C语言取代之后,B语言几乎已遭弃置。

C语言

1、C/C++

C语言是在70年代初问世的。一九七八年由美国电话电报公司(AT&T)贝尔实验室正式发表了C语言。同时由B.W.Kernighan和D.M.Ritchit合著了著名的“THE C PROGRAMMING LANGUAGE”一书。通常简称为《K&R》,也有人称之为《K&R》标准。但是,在《K&R》中并没有定义一个完整的标准C语言,后来由美国国家标准学会在此基础上制定了一个C 语言标准,于一九八三年发表。通常称之为ANSI C。在C的基础上,一九八三年又由贝尔实验室的Bjarne Strou-strup推出了C++。 C++进一步扩充和完善了C语言,成为一种面向 对象的程序设计语言。C++目前流行的集成开发环境最新版本是Borland C++4.5,Symantec C++6.1,和Microsoft VisualC++2017。C++提出了一些更为深入的概念,它所支持的这些面向对象的概念容易将问题空间直接地映射到程序空间,为程序员提供了一种与传统结构程序设计不同的思维方式和编程方法。因而也增加了整个语言的复杂性,掌握起来有一定难度。

2、C#

C#读作C Sharp。最初它有个更酷的名字,叫做COOL。微软从1998年12月开始了COOL项目,直到2000年2月,COOL被正式更名为C#。在1998年,Delphi语言的设计者Hejlsberg带领着Microsoft公司的开发团队,开始了第一个版本C#语言的设计。在2000年9月,国际信息和通信系统标准化组织为C#语言定义了一个Microsoft公司建议的标准。最终C#语言在2001年得以正式发布。C#是微软公司发布的一种由C和C++衍生出来的面向对象的编程语言、运行于.NET Framework和.NET Core(完全开源,跨平台)之上的高级程序设计语言。并定于在微软职业开发者论坛(PDC)上登台亮相。C#是微软公司研究员Anders Hejlsberg的最新成果。C#看起来与Java有着惊人的相似;它包括了诸如单一继承、接口、与Java几乎同样的语法和编译成中间代码再运行的过程。但是C#与Java有着明显的不同,它借鉴了Delphi的一个特点,与COM(组件对象模型)是直接集成的,而且它是微软公司 .NET windows网络框架的主角。

D语言

1、Dephi

Delphi,是Windows平台下著名的快速应用程序开发工具(Rapid Application Development,简称RAD)。它的前身,即是DOS时代盛行一时的“BorlandTurbo Pascal”,最早的版本由美国Borland(宝兰)公司于1995年开发。主创者为Anders Hejlsberg。经过数年的发展,此产品也转移至Embarcadero公司旗下。Delphi是一个集成开发环境(IDE),使用的核心是由传统Pascal语言发展而来的Object Pascal,以图形用户界面为开发环境,透过IDE、VCL工具与编译器,配合连接数据库的功能,构成一个以面向对象程序设计为中心的应用程序开发工具。

2、D语言 (Dlang)

D语言,一种通用计算机程序语言,威力强大、功能丰富,支持多种编程方式,例如面向对象。D语言最初由Digital Mars公司就职的Walter Bright于2001年发布,意图改进C++语言。目前最新D语言被简称为D2。最主要的D语言的实现是DMD。D 语言源自C/C++,借鉴了众多编程语言的特色和现代编译器技术,融会贯通了设计者丰富的实践经验,使之具备了非凡的威力--既有 C/C++ 语言的强大威力,又有 Python 和 Ruby 的开发效率。它集众多系统级编程所需的功能于一身,例如垃圾回收、手工内存操作、契约式设计、高级模板技术、内嵌汇编、内置单元测试、Mixin 风格多继承、类 Java 包管理机制、内置同步机制、内建基本运行时信息。

D 语言。它在C++的基础上有一定的扩展,同时还保持了生成高效代码以及直接访问操作系统API和硬件的能力。D 很适合于编写从中等规模到团队合作完成、数百万行代码规模的各种程序。D 易于学习,为编程者提供了各种便利,采用了各种野心勃勃的编译器优化技术。

D 不是一种解释型语言,所以不需要虚拟机。它是给实际的编程者使用的实用的计算机程序语言,帮助程序员快速、可靠地完成易于维护、易于理解的代码。D 是数十年来实现多种语言编译器的经验的积累,是用那些语言构造大型工程的尝试的积累。D 从那些语言(主要是 C++ )那里获得了灵感,并使用经验和现实世界中的实用性来驯服它。

E语言

1、Erlang

Erlang是一种通用的面向并发的编程语言,它由瑞典电信设备制造商爱立信所辖的CS-Lab开发,目的是创造一种可以应对大规模并发活动的编程语言和运行环境。Erlang问世于1987年,经过十年的发展,于1998年发布开源版本。Erlang是运行于虚拟机的解释性语言,但是现在也包含有乌普萨拉大学高性能Erlang计划(HiPE)开发的本地代码编译器,自R11B-4版本开始,Erlang也开始支持脚本式解释器。在编程范型上,Erlang属于多重范型编程语言,涵盖函数式、并发式及分布式。顺序执行的Erlang是一个及早求值,单次赋值和动态类型的函数式编程语言。

2、易语言(EPL)

易语言 是一门以中文作为程序代码编程语言,其以“易”著称,创始人为吴涛。易语言早期版本的名字为E语言。其最早的版本的发布可追溯至2000年9月11日。创造易语言的初衷是进行用中文来编写程序的实践,方便中国人以中国人的思维编写程序,并不用再去学习西方思维。易语言的诞生极大的降低了编程的门槛和学习的难度。从2000年以来,易语言已经发展到一定的规模,功能上、用户数量上都十分可观。

F语言

1、F#

F#是由微软发展的为微软.NET语言提供运行环境的程序设计语言。它是基于Ocaml的,而Ocaml是基于ML函数程序设计语言的。 这是一个用于显示·NET在不同编程语言间互通的程序设计。

2、Fortran语言

公式翻译器,是FormulaTranslation的中文翻译,它是世界上最早出现的计算机高级程序设计语言的翻译器,广泛应用于科学和工程计算领域。FORTRAN语言翻译器以其特有的功能在数值、科学和工程计算领域发挥着重要作用。Fortran语言的最大特性是接近数学公式的自然描述,在计算机里具有很高的执行效率。易学,语法严谨。可以直接对矩阵和复数进行运算,这一点类似matlab。自诞生以来广泛地应用于数值计算领域,积累了大量高效而可靠的源程序。很多专用的大型数值运算计算机针对Fortran做了优化。广泛地应用于并行计算和高性能计算领域。Fortran90,Fortran95,Fortran2003的相继推出使Fortran语言具备了现代高级编程语言的一些特性。

G语言

1、Golang

Go(又称 Golang)是 Google 的 Robert Griesemer,Rob Pike 及 Ken Thompson 开发的一种静态强类型、编译型语言。Go 语言语法与 C 相近,但功能上有:内存安全,GC(垃圾回收),结构形态及 CSP-style 并发计算。

2、G语言

G语言是指图形化的程序语言,由美国国家仪器有限公司开发,使用这种语言编程时,基本上不写程序代码,取而代之的是流程图。

H语言

1、HTML

HTML称为超文本标记语言,是一种标识性的语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字,图形、动画、声音、表格、链接等。 [1]超文本是一种组织信息的方式,它通过超级链接方法将文本中的文字、图表与其他信息媒体相关联。这些相互关联的信息媒体可能在同一文本中,也可能是其他文件,或是地理位置相距遥远的某台计算机上的文件。这种组织信息方式将分布在不同位置的信息资源用随机方式进行连接,为人们查找,检索信息提供方便

J语言

1、Java

Java (计算机编程语言)Java是一门面向对象编程语言,不仅吸收了C++语言的各种优点,还摒弃了C++里难以理解的多继承、指针等概念,因此Java语言具有功能强大和简单易用两个特征。Java语言作为静态面向对象编程语言的代表,极好地实现了面向对象理论,允许程序员以优雅的思维方式进行复杂的编程 。Java具有简单性、面向对象、分布式、健壮性、安全性、平台独立与可移植性、多线程、动态性等特点 。Java可以编写桌面应用程序、Web应用程序、分布式系统和嵌入式系统应用程序等 。

2、Julia

Julia (编程语言)Julia 是一个面向科学计算的高性能动态高级程序设计语言。其语法与其他科学计算语言相似。在许多情况下拥有能与编译型语言相媲美的性能。Julia 是个灵活的动态语言,适合科学和数值计算,性能可与传统静态类型语言媲美。

3、J#

J#(读音:J Sharp)是微软的 .NET框架下的一门语言,语法与Java相似。J#包含在 Visual Studio 2005 中,以后的 Visual Studio 版本中不再支持。

4、J语言

J语言属于第五代的函数型语言,它是由APL语言创始人,加拿大著名数学 家Ken E.Iverson于90年代初发明,并由Eric和Roger Hui完成。该语言是APL的后继式语言, J语言和APL语言原理基本相同,但是它不使用APL的象形文字,而使用ASCII字符,功能也比AP L更完善、更简洁、更强大。它适用于各种微机和多种操作平台,包括DOS、Windows、OS/2、 Unix和Macintosh等。

K语言

1、Kulics

根据官方描述:K 是一个专注于效率的开源编程语言,它可以帮你轻松构建跨平台软件。通过精心设计的语法规则,这门语言可以有效降低读写负担,让你能够把真正的注意力放在解决问题上。

目前 K 支持编译到 C#/Go/JavaScript/Kotlin从star等指标来看,目前这个项目的关注度还不高。· 容易分辨、现代化的语法。(作者表示借鉴了Go语言的不少语法)· 自动管理内存。· 泛型。· 多范式编程。· 跨平台。· Unicode。· 多后端,支持 C#/Go/JavaScript/Kotlin。· 即将支持LLVM。其实这个项目最早发布于2018年3月份,只不过版本号一直在beta中。but!该语言的开发者是国人!!中国平安的区块链架构师。你可以在某乎找到作者本人这个项目原名是lite,作者后来更名为k语言。主要关注点就在于语法设计上的探索。

2、Kottlin

Kotlin 是一个用于现代多平台应用的静态编程语言 ,由 JetBrains 开发。Kotlin可以编译成Java字节码,也可以编译成JavaScript,方便在没有JVM的设备上运行。Kotlin已正式成为Android官方支持开发语言。

L语言

1、Lua

Lua 是一个小巧的脚本语言。它是巴西里约热内卢天主教大学(Pontifical Catholic University of Rio de Janeiro)里的一个由Roberto Ierusalimschy、Waldemar Celes 和 Luiz Henrique de Figueiredo三人所组成的研究小组于1993年开发的。 其设计目的是为了通过灵活嵌入应用程序中从而为应用程序提供灵活的扩展和定制功能。Lua由标准C编写而成,几乎在所有操作系统和平台上都可以编译,运行。Lua并没有提供强大的库,这是由它的定位决定的。所以Lua不适合作为开发独立应用程序的语言。Lua 有一个同时进行的JIT项目,提供在特定平台上的即时编译功能。Lua脚本可以很容易的被C/C++ 代码调用,也可以反过来调用C/C++的函数,这使得Lua在应用程序中可以被广泛应用。不仅仅作为扩展脚本,也可以作为普通的配置文件,代替XML,ini等文件格式,并且更容易理解和维护。Lua由标准C编写而成,代码简洁优美,几乎在所有操作系统和平台上都可以编译,运行。 一个完整的Lua解释器不过200k,在所有脚本引擎中,Lua的速度是最快的。这一切都决定了Lua是作为嵌入式脚本的最佳选择。

2、L脚本语言

L脚本语言是一个轻量级的,旨在接近自然语言的编程语言,目前支持在中文、英文基础上的编程。并可扩展为任意语种。L脚本语言的语法结构简单,程序结构相对松散,易学易用。目前L脚本语言仍处于开发初期,功能尚不完善。目前尚未提供源码编辑器,建议使用notepad++或者ultraedit进行源码编辑。

3、LOGO语言

“logo”一词源于希腊文,原意为“文字”或“思考”、“想法”。是一种过程性语言,是在1976年由美国麻省理工学院(MIT)佩帕特(Seymour Papert)教授指导下的一个研究小组在LISP语言基础上,专门为儿童研制开发的编程语言。Logo语言虽然结构简单、却有丰富的表达方式,体现了现代计算机科学许多最新概念

M语言

1、MATLAB

MATLAB 是美国MathWorks公司出品的商业数学软件,用于算法开发、数据可视化、数据分析以及数值计算的高级技术计算语言和交互式环境,主要包括MATLAB和Simulink两大部分。MATLAB是matrix&laboratory两个词的组合,意为矩阵工厂(矩阵实验室)。是由美国mathworks公司发布的主要面对科学计算、可视化以及交互式程序设计的高科技计算环境。它将数值分析、矩阵计算、科学数据可视化以及非线性动态系统的建模和仿真等诸多强大功能集成在一个易于使用的视窗环境中,为科学研究、工程设计以及必须进行有效数值计算的众多科学领域提供了一种全面的解决方案,并在很大程度上摆脱了传统非交互式程序设计语言(如C、Fortran)的编辑模式,代表了当今国际科学计算软件的先进水平。MATLAB和Mathematica、Maple并称为三大数学软件。它在数学类科技应用软件中在数值计算方面首屈一指。MATLAB可以进行矩阵运算、绘制函数和数据、实现算法、创建用户界面、连接其他编程语言的程序等,主要应用于工程计算、控制设计、信号处理与通讯、图像处理、信号检测、金融建模设计与分析等领域。MATLAB的基本数据单位是矩阵,它的指令表达式与数学、工程中常用的形式十分相似,故用MATLAB来解算问题要比用C,FORTRAN等语言完成相同的事情简捷得多,并且MATLAB也吸收了像Maple等软件的优点,使MATLAB成为一个强大的数学软件。在新的版本中也加入了对C,FORTRAN,C++,JAVA的支持。

2、M语言

M语言,编程语言,是微软新Oslo发展和面向服务策略的一部分。在一个软件为中心的世界里,我们已经有了太多太多的计算机语言用以编程——从脚本语言到字节码编译语言,再到最高级的架构语言和嵌入式语言。微软正打算开发另外一种编程语言,代号为“M”(代表Microsoft)。这种新编程语言是微软新Oslo发展和面向服务策略的一部分,在保持文本(textual)和特定领域(domaiN-specific)的同时,还整合了来自XAML的特性。与Visual Studio 2010一起,M将与其他两个即将一同发布的组件被直接应用:这两个组件其中一个是QuadraNt,它是一个可视化构建模型的工具;而另外一个组件是在SQL数据库中用于存储和浏览模型的存储器。除此之外,关于该语言微软没有作更多的解释。不过据推测它很可能是一种基于.Net框架的编译语言(终于可以和自然语言代码说再见了)。而且从微软的表述上来看,M正紧追潮流——在努力成为一种跨平台(cross-platform)语言。

O语言

1、Objective-C

Objective-C,通常写作ObjC或OC和较少用的Objective C或Obj-C,是扩充C的面向对象编程语言。它主要使用于Mac OS X和GNUstep这两个使用OpenStep标准的系统,而在NeXTSTEP和OpenStep中它更是基本语言。GCC与Clang含Objective-C的编译器,Objective-C可以在GCC以及Clang运作的系统上编译。1980年代初布莱德·考克斯(Brad Cox)在其公司Stepstone发明Objective-C。他对软件设计和编程里的真实可用度问题十分关心。Objective-C最主要的描述是他1986年出版的书 Object Oriented Programming: An Evolutionary Approach. Addison Wesley. ISBN 0-201-54834-8.

2、O语言

O语言是一款中间计算机语言(或称套装),它具有传统汇编语言的基本特点,也有与它们诸多不同之处。窗口设计、界面描述语言、O中间语言已经能很好的整合在一起(1.0.2.2版),基本有VB的事件驱动和窗口设计功能(但还不能创建COM控件,自带控件也很少)。O语言是一款中文计算机语言(或称套装),各部分开发状态:O汇编语言(简称OASM,√)

O中间语言(简称OML,√)O高级语言(简称OXX,×)界面描述语言(简称OFL,√)窗口设计(√)窗口设计、界面描述语言、O中间语言已经能很好的整合在一起(1.0.2.2版),基本有VB的事件驱动和窗口设计功能(但还不能创建COM控件,自带控件也很少)

P语言

1、PHP

PHP (超文本预处理器)PHP即“超文本预处理器”,是一种通用开源脚本语言。PHP是在服务器端执行的脚本语言,与C语言类似,是常用的网站编程语言。PHP独特的语法混合了C、Java、Perl以及 PHP 自创的语法。利于学习,使用广泛,主要适用于Web开发领域。PHP原始为Personal Home Page的缩写,已经正式更名为 “PHP: Hypertext Preprocessor”。自20世纪90年代国内互联网开始发展到现在,互联网信息几乎覆盖了我们日常活动所有知识范畴,并逐渐成为我们生活、学习、工作中必不可少的一部分。据统计,从2003 年开始,我国的网页规模基本保持了翻番的增长速度,并且呈上升趋势。PHP 语言作为当今最热门的网站程序开发语言,它具有成本低、速度快、可移植性好、 内置丰富的函数库等优点,因此被越来越多的企业应用于网站开发中。但随着互联网的不断更新换代,PHP语言也出现了不少问题。

2、Python

Python (计算机程序设计语言)Python是一种跨平台的计算机程序设计语言。 是一个高层次的结合了解释性、编译性、互动性和面向对象的脚本语言。最初被设计用于编写自动化脚本(shell),随着版本的不断更新和语言新功能的添加,越多被用于独立的、大型项目的开发。Python是一种解释型脚本语言,可以应用于以下领域:Web 和 Internet开发科学计算和统计人工智能桌面界面开发软件开发后端开发网络爬虫

3、Perl

Perl,一种功能丰富的计算机程序语言,运行在超过100种计算机平台上,适用广泛,从大型机到便携设备,从快速原型创建到大规模可扩展开发。Perl借取了C、sed、awk、shell脚本语言以及很多其他程序语言的特性,其中最重要的特性是它内部集成了正则表达式的功能,以及巨大的第三方代码库CPAN。简而言之,Perl像C一样强大,像awk、sed等脚本描述语言一样方便,被Perl语言爱好者称之为“一种拥有各种语言功能的梦幻脚本语言”、“Unix中的王牌工具”。Perl一般被称为“实用报表提取语言”(Practical Extraction and Report Language),你也可能看到“perl”,所有的字母都是小写的。一般,“Perl”,有大写的P,是指语言本身,而“perl”,小写的p,是指程序运行的解释器。

4、Pascal

Pascal (结构化编程语言)的名称是为了纪念十七世纪法国著名哲学家和数学家Blaise Pascal而来的,它由瑞士Niklaus Wirth教授于六十年代末设计并创立的。Pascal语言语法严谨,层次分明,程序易写,可读性强,是第一个结构化编程语言。Pascal语言广泛用于各种软件,程序分为名称(program后自拟)、设置(var后规定)、开始(begin)、程序(正文)、读取(read/read ln)、结束(end),结构层次强,严谨而又紧密。

Pascal由瑞士苏黎世联邦工业大学的Niklaus Wirth教授于六十年代末设计并创立。1971年,以电脑先驱帕斯卡pascal的名字为之命名 [1] 。Pascal语言语法严谨,一出世就受到广泛欢迎,迅速地从欧洲传到美国。Pascal基于ALGOL编程语言,为纪念法国数学家和哲学家布莱兹·帕斯卡而命名。维尔特后来开发了类似Pascal的Modula-2和Oberon。在开发Pascal之前,维尔特开发了语言Euler,然后开发了Algol-W。

Pascal是最早出现的结构化编程语言,具有丰富的数据类型和简洁灵活的操作语句。高级语言发展过程中,Pascal是一个重要的里程碑。Pascal语言是第一个系统地体现了E.W.Dijkstra和C.A.R.Hoare定义的结构化程序设计概念的语言。

最初,Pascal在很大程度上但不是完全地为了教授学生结构化编程。很多代学生已使用Pascal作为本科课程的入门语言。Pascal的变种也逐渐地用于从研究项目到PC游戏和嵌入式系统的所有领域。更新的Pascal编译器存在于广泛使用它的领域。

GCC,Gnu C编译器,最初是用Pascal的一种方言Pastel编写的(见GCC#概观)。Pascal是Apple Lisa和早期Mac开发使用的高级语言;最初Macintosh操作系统的部分是从Pascal源代码手工翻译成Motorola 68000汇编语言的。流行的排版系统TeX是由高德纳使用基于DEC PDP-10 Pascal的最初文学编程系统WEB编写的,而像Total Commander的应用是使用Delphi(即Object Pascal)编写的。

Object Pascal仍然广泛用于开发像Skype这样的Windows应用。

Q语言 (脚本语言)

1、Q语言

Q语言是在VBScript的基础上发展起来,专用于按键精灵系列产品(包括但不限于按键精灵、按键小精灵、简单游等)的一种易学易用、功能强大的脚本语言。Q语言以VBScript为基础,去掉了少量不重要的功能,且增加了很多更易于使用,更符合国情的新功能。

R语言

1、Rust

Rust是一门系统编程语言 ,专注于安全 ,尤其是并发安全,支持函数式和命令式以及泛型等编程范式的多范式语言。Rust在语法上和C++类似 ,但是设计者想要在保证性能的同时提供更好的内存安全。 Rust最初是由Mozilla研究院的Graydon Hoare设计创造,然后在Dave Herman, Brendan Eich以及很多其他人的贡献下逐步完善的。Rust的设计者们通过在研发Servo网站浏览器布局引擎过程中积累的经验优化了Rust语言和Rust编译器。Rust编译器是在MIT License 和 Apache License 2.0双重协议声明下的免费开源软件。 Rust已经连续四年(2016,2017,2018,2019)在Stack Overflow开发者调查的“最受喜爱编程语言”评选项目中折取桂冠。

2、Ruby

Ruby (一种面向对象程序设计的脚本语言)同义词 ruby语言一般指Ruby(一种面向对象程序设计的脚本语言)Ruby,一种简单快捷的面向对象(面向对象程序设计)脚本语言,在20世纪90年代由日本人松本行弘(Yukihiro Matsumoto)开发,遵守GPL协议和Ruby License。它的灵感与特性来自于 Perl、Smalltalk、Eiffel、Ada以及 Lisp 语言。由 Ruby 语言本身还发展出了JRuby(Java平台)、IronRuby(.NET平台)等其他平台的 Ruby 语言替代品。Ruby的作者于1993年2月24日开始编写Ruby,直至1995年12月才正式公开发布于fj(新闻组)。因为Perl发音与6月诞生石pearl(珍珠)相同,因此Ruby以7月诞生石ruby(红宝石)命名。

3、R语言

R是用于统计分析、绘图的语言和操作环境。R是属于GNU系统的一个自由、免费、源代码开放的软件,它是一个用于统计计算和统计制图的优秀工具。R是统计领域广泛使用的诞生于1980年左右的S语言的一个分支。

S语言

1、Swift

SWIFT (计算机编程语言)Swift是一种新的编程语言,用于编写iOS和macOS应用。Swift结合了C和Objective-C的优点并且不受C兼容性的限制。Swift采用安全的编程模式并添加了很多新特性,这将使编程更简单,更灵活,也更有趣。Swift是基于成熟而且倍受喜爱的Cocoa和Cocoa Touch框架,它的降临将重新定义软件开发。Swift,苹果于2014年WWDC苹果开发者大会发布的新开发语言,可与Objective-C共同运行于macOS和iOS平台,用于搭建基于苹果平台的应用程序。Swift是一款易学易用的编程语言,而且它还是第一套具有与脚本语言同样的表现力和趣味性的系统编程语言。Swift的设计以安全为出发点,以避免各种常见的编程错误类别。2015年12月4日,苹果公司宣布其Swift编程语言开放源代码。长600多页的The Swift Programming Language 可以在线免费下载。

2、Scala

Scala 是一门多范式(multi-paradigm)的编程语言,设计初衷是要集成面向对象编程和函数式编程的各种特性。

Scala 运行在Java虚拟机上,并兼容现有的Java程序。

Scala 源代码被编译成Java字节码,所以它可以运行于JVM之上,并可以调用现有的Java类库。

3、S语言

是由AT&T贝尔实验室的John Chambers和另外一些人于1976年共同开发的一种用来进行数据探索、统计分析、作图的解释型语言。它的丰富的数据类型(向量、数组、列表、对象等)特别有利于实现新的统计算法,其交互式运行方式及强大的图形及交互图形功能使得我们可以方便的探索数据。3、SETL语言(SETL language)是基于集合论的甚高级语言。它提供了描述有限集和元组及其有关操作和控制结构的手段,以提高开发功效,增加程序的易读性。该语言由美国纽约大学J.T.Schwartz等人于1975年提出。SETL语言以可移植的方式实现,已在IBM 370,DEC10和VAX,CDC 6600等机器上运行。在纽约大学、加州大学伯克莱分校等大学的课程教学中,学生们已使用SETL语言进行算法设计。SETL在支持类PASCAL程序设计语言的大部分标准数据结构的基础上,能够支持集合和元组

V语言

1、V语言

是为构建可维护软件而设计的一种静态类型的编程语言。此语言的语法结构与Go相似,同时也受Oberon,Rust和Swift语言的影响。V语言是一种非常简单的语言。阅读本文档,将花费您大约半小时,到最后,您将几乎学会V语言的全部。尽管很简单,但它为开发人员提供了强大的功能。使用其他语言进行的任何操作,用V语言都可以实现。V语言官网地址:https://vlang.ioV语言Github地址:https://github.com/vlang/vV语言开发文档:https://www.v-lang.cn/docs/strings

W语言

1、WinDev

WinDev是一个由法国公司PCSOFT所开发的一款自动编程软件,其设计目的是为了开发应用。其主要面向数据为Windows8、Vista、XP、2008、2003、2000,也同样支持Linux,.Net和Java。使用全中文编程语言(W语言),全中文用户界面。第一个WinDev版本于1993年出版,并同期推出了WebDev以及WinDev Mobile

X语言

1、X++

X++是一个专门为Axapta产品所设计的面向对象语言, 包含处理数据库查询的内建结构. 它的大纲是模仿Java Precisely(一个简明的Java编程语言的描述), 适合熟悉编程语言以及对语法语义和编译器解释器的关系有所了解的读者.这些公开的章节将提供一些细节, 这些细节是关于研究问题域和Axapta架构的描述的方法论.如果熟悉Axapta系统将会增强理解X++中某些组成的效果. 在依次深入研究该语言每种结构之前, 我们会先概览一下X++的基本概念. 这些基本概念包括程序框图, 命名规则, 保留字, 数据类型, 类, 接口, 表达式和语句. 本报告将会以X++语言的建议和往后发展的可能性作为结束.

Y语言

1、雅奇MIS

雅字 拼音第一个字母为Y所以牵强的命名为Y语言,请不要纠结。

《雅奇MIS》采用“图示化逻辑结构语言”为内核技术,使得无编码的图示化编程成为可能。在当今世界上,达到《雅奇MIS》所采用的如此成熟的“图示化语言技术”的产品,还绝无仅有。因此《雅奇MIS》对于IT科技是一场巨大的革命性进步。

Z语言

1、Z语言

外文名 Z notionZ语言是一种用“数学文字”或“数学符号”来描述计算机系统的规范化语言,它不但能应用于计算机硬件系统,而且也特别适用于计算机软件系统,Z语言描述“做什么”而不涉及“怎么做”,只对目标软件系统进行功能描述。实际上,Z语言仅仅是一套规定的数学符号,使用Z语言所写的“程序”是对计算机软件或硬件系统的一种抽象化设计。所以,利用Z语言写出来的内容不是计算机程序,更不是可以编译而生成能够在计算机上运行的代码。利用Z语言写出来的内容不是让计算机运行的,而是供人理解和分析的。用户可以通过这些内容去理解计算机系统的模块、数据类型、过程、函数、对象、类等,进而对计算机系统的行为、结构、逻辑进行分析、验证、改进、测试等。


一章 职业规划和前景


  • 职业方向规划定位:
  • web前端开发工程师
  • web网站架构师
  • 自己创业
  • 转岗管理或其他
  • web前端开发的前景展望:
  • 未来IT行业企业需求最多的人才
  • 结合最新的html5抢占移动端的市场
  • 自己创业做老板
  • 随着互联网的普及web开发成为企业的宠儿和核心
  • web职业发展目标:
  • 第一、梳理知识架构
  • 负责内容的HTML
  • 负责外观的css(层叠样式表)
  • 负责行为的js
  • ps切图
  • 第二、分解目标(起步阶段、提升阶段、成型阶段)
  • 起步阶段:
  • 基本知识的掌握
  • 常用工具的掌握
  • 沟通技巧的掌握(围绕客户的需求)
  • 良好的开发习惯(加注释、对齐方式)
  • 提升阶段:
  • 熟悉掌握HTML基本标签和属性
  • 熟练掌握css的基本语法和使用
  • 浏览器兼容和w3c标准的掌握
  • 结合html+css+js开始系统项目的开发
  • 成型阶段:
  • 精通DIV+CCS布局
  • 精通css样式表控制html标签
  • 熟悉运用js制作动态网站的效果
  • 能独立开发完成网站

第二章 html基本结构


  • 认识HTML:
  • html不是一种编程语言,是一种标志语言
  • 标记语言是由一套标识标签组成的
  • html使用标签来描述网页
  • html结构:
<html>
 <head></head>
 <body></body>
</html>
  • 不成对出现的标签
  • <br> <hr> <meta> <img> <input..> <option..> <link>
  • HTML 基本标签的讲解:
  • <html> <head> <body>标签
  • <h1>—-<h6>仅仅用于标题文本,不要为了产生粗体文本使用它们
  • <p>标签 段落标签
  • <strong><b>标签
  • 都会让文字产生加粗效果
  • <strong>用于强调文本,强度更深,表示重要文本—>用于SEO优化
  • <b>只是视觉加粗效果—>单纯为了产生加粗
  • <em> <i>标签
  • em用于强调文本
  • i只是视觉斜体效果
  • <strong>比<em>强调更强
  • 特殊符号:
  • —->空格
  • > —>大于号
  • &lt;—>小于号
  • &quot;—>引号
  • ©–>版权号

第三章 html基本标签


  • HTMl基本标签:
  • span标签
  • 对被用来组合文档中的行内元素
  • 注意:span没有固定的格式表现,当对它应用样式时,才会产生视觉上的变化
  • <pre>标签
  • 文字的格式按源码的排版来显示,我们称之为预处理格式
  • <a>标签—>他有一个必不可少的属性 href
  • target属性:
  • _self(在原来页面打开)
  • _blank(新窗口打开)
  • _top(打开时忽略所有的框架)
  • _parent(在父窗口中打开)
  • 创建锚点和锚链接
  • 锚点也是一种超链接,是页面内进行跳转的超链接
  • 第一步:创建锚点 <a name="锚点名称"></a>
  • 第二步:使用创建好的锚点名称 <a href="#锚点名称">内容</a>
  • marquee标签
  • 可以创建一个内容滚动效果
<marquee direction="down" loop="4" onmouseover=this.stop() onmouseout=this.start()></marquee>
  • direction 表示滚动方向,取值有(left,right,up,down,默认left)
  • loop表示滚动循环的次数,默认为无限循环
onmouseover=this.stop() onmouseover=this.start() scrollamout="1"(滚动速度)
  • 表示当鼠标移上区域的时候停止滚动,鼠标移开继续滚动

第四章 img图片标签与路径


  • 图片标签与路径:
  • 常见图片格式 jpg png gif
  • Gif (只支持全透明)
  • Jpeg /jpg
  • Png 半/全透明都支持
  • 图片标签写法 :
  • <img src="" alt="" width="" height="" />
  • 图片四要素:
  • src="" 图片路径
  • alt="" 图片含义
  • width="" 图片宽度 和图片大小保持一致
  • height="" 图片高度 和图片大小保持一致
  • title=""
  • 路径知识:
  • 相对路径、绝对路径:
  • 相对路径:(Relative Path) 相对于该文件的路径;
  • 绝对路径:(Absolute Path) 从磁盘出发的路径;
  • <img src="" …… align="" /> align属性–设置图片与后面文字的位置关系
  • 值–top、bottom、middle、absmiddle、left、right
  • 在静态页面中:
  • /开头表示根目录;
  • ./表示当前目录;(斜画线前面一个点)
  • ../上级目录;(斜画线前面两个点)
  • 直接用文件名不带/也表示同一目录
  • 这些都是相对于当前文件的位置来说的,如果用绝对路径的话就是写全了。

第五章 三种列表的讲解


  • 三种列表的知识讲解:
  • <ul>无序列表
  • 无序列表是一个没有顺序项目的列表,此列表项默认粗体圆点进行标识
<ul>
 <li></li>
 <li></li>
 <li></li>
</ul>
  1. 有序列表
  • 有序列表也是一列项目,只是列表项目使用的是数字进行标记。 有序列表始于 <ol> 标签。每个列表项始于 <li>标签。
<ol>
 <li>内容一</li>
 <li>内容二</li>
 <li>内容三</li>
</ol>
  • 列表符号
  • 无序列表-列表符号:
  • type="circle" 空心圆 type=“disc” 实心圆 默认值 type="square" 方块符
  • 有序列表-列表符号
  • type="A" A B C D
  • type="a" a b c d
  • type="1" 1 2 3 4 默认值type=”I” I II III type=”i” i ii iii
  • 列表嵌套
  • 无序列表-嵌套
<ul>
 <li>柚子
 <ul>
 <li>沙田柚</li>
 <li>蜜柚</li>
 </ul>
 </li>
 <li>荔枝</li>
 <li>苹果</li></ul>
  • 有序列表-嵌套
<ol>
 <li>茶
 <ul>
 <li>红茶</li>
 <li>绿茶</li>
 </ul>
 </li>
 <li>果汁</li>
 <li>牛奶</li></ol>
  • 定义列表
  • 定义列表不仅仅是一列项目,而是项目及其注释的组合。定义列表以 <dl> 标签开始。每个定义列表项以 <dt>开始。每个自定义列表项的定义以 <dd> 开始。
<dl> 
 <dt>pc网页制作</dt> 
 <dd>学习DIV+CSS JS JQ 项目实战</dd> 
 <dt>手机网页制作</dt> 
 <dd>手机网页制作实战</dd>
</dl>
  • dd是对dt的解释
  • < dl>< /dl>用来创建一个普通的列表,
  • < dt>< /dt>用来创建列表中的上层项目,
  • < dd>< /dd>用来创建列表中最下层项目,
  • < dt>< /dt>和< dd>< /dd>都必须放在< dl>< /dl>标志对之间。
<dl>
 <dt>中国城市</dt>
 <dd>北京 </dd>
 <dd>上海 </dd>
 <dd>广州 </dd>
 <dt>美国城市</dt>
 <dd>华盛顿 </dd>
 <dd>芝加哥 </dd>
 <dd>纽约 </dd>
</dl>
  • dl是definition list的缩写
  • dt是definition title的缩写
  • dd是definition description的缩写
  • list-style属性具有三个属性分量:
  • list-style-position :设置列表项图标的位置,位于文本内或者文本外
  • list-style-type: 设置列表项图标的类型
  • list-style-image:使用图像设置列表项图标

第六章 表单元素(上)


  • 表单标签:
  • <form>表单标签
  • <form>表单是一个包含表单元素的区域,包括起来的都是表单的内容
<form>
 <input type="text"/>
</form>
  • HTML标签 - Action和确认按钮:
  • 当用户单击确认按钮时,表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。
<form action="html.do" method="get"> 
 username: <input type="text" name="user" /> 
 <input type="submit" value="提 交" />
</form>
  • HTML标签 - 隐藏域隐藏标签:
  • 隐藏域在页面中对于用户是不可见的,在表单中插入隐藏域的目的在于收集或发送信息,以利于被处理表单的程序所使用。浏览者单击发送按钮发送表单的时候,隐藏域的信息也被一起发送到服务器
<form> 
 <input type="hidden" name="hid" value="value">
</form>
  • <input>标签的掌握
  • 常用type类型:
  • <input type="" name="" value="" />
  • type="text" 单行文本输入框
  • type="password" 密码(maxlength="")
  • type="radio" 单项选择(checked="checked")
  • type="checkbox" 多项选择
  • type="button" 按钮
  • type="submit" 提交 type="image"图片提交
  • type="file" 上传文件
  • type="reset"重置
  • type="hidden" 隐藏
  • 关于表单中的设置默认值:
<input type="text" name="" value="今天心情不错" />
<input type="radio" name="" value="" checked="checked">
<input type="checkbox" name="" value="" checked="checked">

<select name="" >
 <option value=""></option>
 <option value="" selected="selected"></option>
<select>
  • textarea没有默认值
  • <label>标签的使用
  • <label></label>
  • label 元素不会向用户呈现任何特殊效果。
  • 不过,它为鼠标用户改进了可用性。
  • 如果您在 label 元素内点击文本,就会触发此控件。
  • 就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。
  • <label> 标签的for 属性应当与相关元素的 id属性相同。
  • 例子:(重要—注册表单–用户体验–必做)
<p>单向选择</p>
<label for="male">男:</label><input type="radio" name="sex" id="male"/>
<label for="nv">女:</label><input type="radio" name="sex"checked="check"/>

第七章 表单和表格(下)


  • 表单和表格标签:
  • <textarea>文本域标签
  • <textarea>标签:
  • <textarea></textarea>是文本域标签,可以在其中插入一段文字内容,它有两个常用属性rows和cols
  • 注意:
  • rows表示这个文本域有多少行
  • cols表示这个文本域有多少列
  • 除了这两个属性它还有readonly(只读,文本域的内容无法改变,相当于协议)和title(鼠标放上提示)
  • <select>标签的掌握
  • 注:当提交表单时,浏览器会提交选定的项目,或者收集用逗号分隔的多个选项,将其合成一个单独的参数列表,并且在将 <select> 表单数据提交给服务器时包括 name属性
<form> 
 <select name="" id="">
 <option value="1">1月</option> 
 <option value="2">2月</option> 
</select>
</form>
  • 常用到的属性:disabled=“disabled” name="sel" size="2"
  • <table>表格标签
  • <table>表格标签:<table>是表格标签,可以用它定义一个表格。
<table border="1">
 <tr>
 <td>姓名</td>
 <td>性别</td>
 </tr>
</table>
  • 注意:<table>的border属性不能少
  • <tr> <td>标签的使用
  • <tr>行标签:
  • <tr>可以定义表格中的一行,一个<tr></tr>表示一行。
<table border="1">
<tr>
 <td>姓名</td>
 <td>性别</td>
</tr>
<tr>
 <td>姓名</td>
 <td>性别</td>
</tr>
</table>
  • <td>单元格标签:
  • <td>可以定义表格中的一个单元格,<td></td>表示一个单元格。
<table border="1">
<tr>
<td >姓名</td>
<td>性别</td>
<td>爱好</td>
</tr>
</table>
  • border-collapse 属性设置是否将表格边框折叠为单一边框:
  • border-collapse:collapse;
  • colspan左右合并
  • rowspan上下合并

第一部分总结:

  • 非可视化标签:head meta style scrpit...
  • 可视化标签:img div span a ul li…
  • 只有可视化标签,才能用css改变它
  • 单标签:meta link base img input br hr
  • 双标签:html head body div a p span ..ul li ol dl ….
  • 常用可视化标签
  • div
  • 一般用它来布局
  • a 超链接标签
  • href*属性:设置跳转的网页地址
  • target属性:设置跳转的目标
  • 结论:凡事页面可以点击跳转或者表单提交的文字,都用a标签
  • img
  • src*属性用来设置图片的url数据
  • alt提供给搜索引擎搜索的
  • width
  • height
  • 结论 :显示图片
  • ul li
  • 列表
  • 结论:只要将来设计页面中有固定样式的列表,就用ul和li
  • table caption tr td (th)
  • 慢慢已经被淘汰了 被ul li代替
  • 如果是合并竖排的就是合并行(rowspan)
  • 如果是合并横排的就是合并列(colspan)

HTML部分导图总结


  • HTML5标签集合

学习从来不是一个人的事情,要有个相互监督的伙伴,想要学习或交流前端问题的小伙伴可以私信“学习”小明加群获取2019web前端最新入门资料,一起学习,一起成长!

tml入门基础笔记(简单实用)

一、初识html

1.HTML:Hyper Text Markup Language(超文本标记语言)

java是一门编译性语言

html是一门解释性的标记语言

超文本:文字、图片、音频、视频、动画、超链接

标记:就是指组成HTML的各种标签

2.HTML5的优势:

1、各大浏览器厂商对它的支持

2、市场的需求

3、跨平台

3.W3C标准:

1、结构化标准:指用什么语言去搭建整个网站(html 5)

2、表现化标准:指用什么去装饰整个网站(css3)

3、行为标准:指用什么去实现网站的功能(JavaScript,jQuery)

4.html的基本结构:

<html>

<head>

<title>天猫精选-理想生活上天猫</title>

</head>

<body bgcolor="pink">

大家好!!!!!

</body>

</html>

双标签:有个两个标签成对出现的叫做双标签

表示HTML网页的开始,表示网页的结束

表示网页头部的开始,表示网页头部的结束

表示网页身体的开始,表示网页身体的结束

表示网页标题的结束

标题标签

<h1></h1>....<h6></h6>:会对文字进行加粗,并且改变字体的大小,还会进行换行

段落标签

<p></p>:表示它独占一行,会保留段落之间的间距

加粗

<strong></strong>:表示加粗

斜体

<em></em>:表示斜体

字体设置

<font></font>:表示字体

属性:color颜色

face字体的样式

size字体的大小

单标签:只有一个,开始就结束的叫做单标签

属性:charset = “utf-8”;utf-8表示国际编码格式,所有的字符都能识别

换行标签

<br/>:表示换到下一行

水平线标签

<hr/>:表示水平线

属性:width表示水平线的宽度

size表示水平线的厚度

color表示水平线的颜色

align表示水平线的水平位置,left左边,center中间,right右边

图像标签

<img src="" alt="" title=""/>

src表示的是图片地址

绝对路径:直接写完整图片所在的位置

相对路径:先找到和你的网页所在同一级的图片所在位置,然后再去在这个基础

去找图片的位置,如果图片在下一级那么使用“/”来找到它,如果

上一级使用“..”来找到它

alt表示的是图片加载失败的替代文字

title表示的是鼠标悬浮时图片的提示文字

width表示图片的宽度

height表示图片的高度

特殊标签:

大于符号:>(great than)

小于符号:<(less than)

空格符号:

版权符号:©

注释:

5.超链接标签

<a href="" target=""></a>

1

href表示链接的地址,使用相对路径的方式去使用

target表示连接的方式

_blank表示在新窗口打开

_self表示在本窗口打开

_parent表示在父窗口打开

1、页面间的链接,用于两个页面之间相互的跳转

2、锚链接,用于页面之间定位

①要设置一个锚点,语法锚点

②将点击之后要跳转的超链接设置跳转的锚点位置,语法:

如果不在同一个页面中,先写好要跳转页面所在的位置,然后再写锚点的名字

3、功能性链接 (发邮件、msn、可以打开本地的相应的客户端)

语法:

二、网页媒体元素

1.视频元素<video></video>

属性:src表示添加视频的路径(位置)

controls表示在添加的视频元素上添加播放控件,只有一个属性值

/autoplay表示自动播放(慎用),只有一个属性值

如果属性只有一个值,属性值可以省略不写

source表示引用的视频源路径,一般会引用多个源路径,以避免浏览器不兼容的问 题

2.音频元素<audio></audio>

属性:src表示添加视频的路径(位置)

controls表示在添加的音频元素上添加播放控件,只有一个属性值

/autoplay表示自动播放(慎用),只有一个属性值

source表示引用的音频源路径,一般会引用多个源路径,以避免浏览器不兼容的问 题

3.内嵌框架<iframe></iframe>

属性:src表示添加内嵌内容的路径

name表示这个框架的名字

width表示这个框架的宽度

height表示这个框架的高度

frameborder表示内嵌框架的边框

scrolling表示是否出现滚动条

作用:

1、将多个网页重复的部分抽取出来,通过内嵌框架的方式,放到各个网页中

2、使用<a>标签跳转到指定的框架中,先在指定要跳转到的框架中取一个name,使用target=“name的值”

<a>标签一定要写href属性才能生效,如果不想跳转到任何页面,那么href="#",表示该超链接为空

链接,点击空链接会刷新页面

4.语义化结构标签:主要是为了让结构更加清晰化

<header>表示页面头部内容

<section>表示页面主体内容

<footer>表示页面底部内容

<nav>表示导航栏内容

<aside>表示侧边栏内容

<article>表示页面独立文章内容

三、表单元素

1.表单<form></form>

属性:1、method表示表单的提交方式,有两个值,第一个叫post,第二个叫get

get方式的请求会将表单中所有表单元素信息显示在地址栏中

post方式的请求必须有一个服务器来处理请求,所有表单元素的信息不会显示在地址栏中, 在实际开发中一般使用post方式请求

2、action表单要提交的位置

2.表单元素

语法:

属性: name表示input标签的名字

value表示input标签的值

type表示input标签的元素类型

文本框:专门用来输入文字

语法:<input type="text" name="userName" value="admin"/>,type的值为text

size表示文本框的长度

maxlength表示允许输入的最大字符长度

密码框:用来输入密码

语法:<input type="password" name="userName" value="admin"/>,

type的值为password

size表示文本框的长度

maxlength表示允许输入的最大字符长度

单选按钮

<input type="radio" name="sex" value="boy"/>男

<input type="radio" name="sex" value="girl"/>女

1

2

注意:单选按钮的每个input中的name值必须相同,不然不能实现选择一个切换的作用

checked属性表示默认选中

1

2

复选框

<input type="checkbox" name="hobby" value="" />打游戏

<input type="checkbox" name="hobby" value="" checked/>睡觉

<input type="checkbox" name="hobby" value="" />出去约会

1

2

3

复选框可以选择多个,并且可以取消

checked属性表示默认选中

1

2

下拉列表框

<select>表示定义了一个列表框

<option>表示列表项

<select>

<option>--请选择--</option>

<option selected>中国</option>

<option>美国</option>

</select> selected表示默认选中

按钮

1、提交按钮submit,它可以将表单中的信息提交到指定的位置

2、重置按钮reset,它可以将表单中的信息恢复到默认值

3、普通按钮button,它只是单纯起一个按钮的作用,需要和JavaScript和jQuery一起使

用,实现各种功能

4、图片按钮image,src表示图片的路径,也具有提交作用

多行文本域:需要输入多行文字

<textarea>表示定义了一个多行文本域

cols表示文本域的宽度

rows表示文本域的高度

文件域:上传文件

<input type="file" name="files"/>

1

需要设置编码属性enctype="multipart/form-data",表示将表单数据分为多部分提交

1

邮箱:可以进行邮箱验证

网址:可以进行网址验证

<input type="url" name="url"/>

1

数字:提供输入数字

min表示允许的最小值

max表示允许的最大值

step表示每次增加或者减少的数字间隔

value表示默认值

搜索框:可以搜索提示关键字的文本框

<input type="search" name="search" />

<input type="button" value="百度一下" />

1

2

3.表单的高级应用

1、隐藏域:主要应用于在提交信息时不想让用户看到的信息进行隐藏提交

<input type="hidden" name="hidden" value="666"/>

1

2、只读和禁用属性

只读:表示在网站上用户只能够查看,不能够修改的数据,使用readonly添加只读

禁用:一般表示在满足某个条件之后,才能使用的功能,使用disabled添加禁用

3、表单元素的标注

①选择要点击后跳转文本加上<label>标签

②选择跳转对应的表单元素,给它加上id这个属性(id属性值在整个网页只能出现一

次,不可以有重复的id值)

③在<label>中添加for属性,然后属性值为对应的id值

4.表单的初步验证

为什么要进行表单验证

1、减轻服务器的压力

2、保证数据的可行性和安全性

5.验证的方法

1、placeholder表示这个表单元素期待用户输入什么信息,它是起提示作用,当用户输入

内容时,提示信息隐藏

2、required表示表单元素填写内容不能为空,使用了required的该表单元素必须填写

3、pattern表示表单中的内容必须和输入的正则表达式一致

^表示正则表达式的开始

$表示正则表达式的结束

[]表示在中括号中任选其中一个

\d表示匹配0~9之间的任意一个数

{n}表示前面的一种匹配方式匹配的次数,表示匹配n次

-表示就是-

\w表示匹配所有字母或数字或下划线

\u4E00-\u9FA5匹配汉字

{4,10}表示匹配前面的一种匹配方式4~10次

A-Z表示匹配大写的英文字母

a-z表示匹配小写的英文字母

|表示或者

四、初识CSS3

1.CSS:层叠样式表,它是专门用来设计网页风格的

2.CSS的优点

1、内容与表现分离,便于网页维护

2、网页的表现统一,统一风格

3、丰富的样式,使得页面布局更加灵活

4、减少网页的代码量,增加网页的浏览速度

5、运用独立于页面的CSS,有利于网页被搜索引擎收录

3.CSS样式的语法

选择器{

声明(可以为1~n条)

属性:属性值;

}

选择器:需要添加这些声明的元素(标签)

声明:由属性和属性值组成,中间用“:”,使用“;”结尾

4.在html中添加样式的方式

1、行内样式

在需要添加样式的标签中,添加一个style属性,在style属性中添加声明

2、内部样式

在里面添加一个,然后通过选择器和声明添加样式

3、外部样式

它可以实现表现与内容的彻底分离,可以让样式表重复使用,便于维护和修改,并且

可以极大的减少代码量

①链接外部样式表

语法:

href表示引用的哪一个外部样式表

rel表示使用的是样式表

type表示文本类型为css类型

②导入外部样式表

语法:@import url(“css/第一个外部样式.css”);

区别:链接外部样式表它是先将外部的CSS样式添加到网页中进行加载,再加载网页的

内容,导入外部样式表是先加载网页中的内容,再进行外部样式表的加载

样式表的优先级别

行内样式>内部样式>外部样式,遵循“就近原则”

5.CSS3中的选择器

一、基本选择器

1、标签选择器:以标签名称作为选择器的名称

选择所有网页的该标签元素,比如:p表示选择该网页中所有的p标签

2、类选择器:以类的名称作为选择器的名称,并且在选择器的名称前加上“.”,类

名能够重复使用

3、id选择器:以id的名称作为选择器的名称,并且在选择器的名称前加上“#”,id

名在该网页只能出现一次,具有唯一性

选择器的优先级

id选择器>类选择器>标签选择器

二、层次选择器

1、后代选择器

语法:E F{声明},E表示的是被匹配的元素,F表示被匹配的E的后代元素

比如:body p{},表示匹配所有body的后代p元素

2、子选择器

语法:E>F{声明},E表示的是被匹配的元素,F表示被匹配的E的子元素

比如:body>p{},表示匹配所有body的子元素中的p元素

3、相邻兄弟选择器

语法:E+F{声明},E表示的是被匹配的元素,F表示被匹配的E的相邻兄弟元素

比如:.p1+p{},表示匹配.p1的相邻元素并且为p元素,只匹配后面的元素

4、通用兄弟选择器

语法:E~F{声明},E表示的是被匹配的元素,F表示被匹配的E的所有兄弟元素

比如:.p1~p{},表示匹配.p1的所有兄弟元素并且为p元素,只匹配后面的

元素

三、结构伪类选择器

1、语法:E>F:first-child,E表示的是被匹配的元素,F表示被匹配的F:first-

child表示被匹配的E的子元素中第一个元素并且这个元素是F元素

2、语法:E>F:last-child,E表示的是被匹配的元素,F表示被匹配的F:last-

child表示被匹配的E的子元素中最后一个元素并且这个元素是F元素

3、语法:E>F:nth-child(n),E表示的是被匹配的元素,F表示被匹配的F:nth-

child(n)表示被匹配的E的子元素中最后一个元素并且这个元素是F元素

even表示匹配所有偶数行

odd表示匹配所有奇数行

4、语法:E>F:nth-of-type(n),E表示的是被匹配的元素,F表示被匹配的F:nth-

of-type(n)表示被匹配的E的子元素中所有的F元素,然后再去找第n个

E>F:nth-child(n)表示先匹配所有的儿子,再去找第几个儿子是不是F元素,如果是

就能匹配,E>F:nth-of-type(n)先匹配所有F元素,再去找第几个元素

四、属性选择器

1、E[attr],E表示匹配的E元素,attr表示属性,匹配具有attr属性的E元素

2、E[attr=val],匹配具有attr属性,并且属性值为val的E元素

3、E[attr^=val],匹配具有attr属性,并且属性值以val开头的E元素

4、E[attr$=val],匹配具有attr属性,并且属性值以val结尾的E元素

5、E[attr*=val],匹配具有attr属性,并且属性值中包含val的E元素

六、CSS3美化网页元素

前言:<span>这个标签没有任何实际意义,它只是为了突出显示某个部分,它是一个行内元素,不能够独

占一行,并且该元素所占的区域是根据内容大小决定,不会因为改变宽度和高度改变它的大小

<div>这个标签没有任何实际意义,它只是为了将某些部分装起来,它是一个块元素,会独占一行,

并且该元素所占的区域是根据它的宽度和高度决定,会因为改变宽度和高度改变它的大小

1.字体样式:

1、font-family字体类型,字体类型的值有:“楷书”、“隶书”、“微软雅黑”、英文字体

可以写多个字体格式,使用“,”隔开,如果同时存在英文和中文字体,英文就显示

英文字体,中文就显示中文字体,并且英文字体要放在中文字体前面

2、font-size字体大小,就是改变字体大小,字体大小的单位使用px

3、font-style

字体风格,normal正常的(默认)、italic(倾斜的)、oblique(倾斜的)

4、font-weight字体粗细,bold(粗体)、bolder(更粗的)、lighter(细的)

font字体属性,需要满足字体属性设置顺序,风格=》粗细=》大小=》类型

2.文本样式:

1、color

文本颜色

①使用英文单词去表示颜色

②使用十六进制的方式表示,并且如果相邻的两两数字相同,可以缩写为一位

③使用三原色的方式去表示,语法:rgb(r,g,b),rgba(r,g,b,a)

r,g,b取值从0~255

a表示透明度,取值从0~1,0表示完全透明,1表示完全不透明

2、text-align

水平对齐方式,设置文本的水平对齐方式

属性值:center居中,left居左,right居右

3、vertical-align垂直对齐方式,设置文本的水平对齐方式

属性值:middle居中,top居上,bottom居下

4、text-indent设置文本首行缩进,属性值一般使用em相对单位,em表示长度为文本字符

大小的长度

5、line-height设置文本行高,属性值使用px为单位,还可以设置为倍数

6、text-decoration

文本装饰

属性值:①none表示没有任何装饰

②underline表示下划线

③overline表示上划线

④line-through表示删除线

7、text-shadow文本阴影

语法:text-shadow : color x-offset y-offset blur-radius; color阴影颜色

x-offset表示X轴偏移量,正数往右偏移,负数往左偏移

y-offset表示Y轴偏移量,正数往下偏移,负数往上偏移 blur-radius表示模糊半径

2.超链接伪类

1、a:link单击访问前的超链接样式

2、a:visited单击访问后的超链接样式

3、a:hover鼠标悬浮的超链接样式

4、a:active鼠标单击未释放的超链接样式

列表样式

1、list-style-type表示设置列表的标记类型

常用类型:none表示没有标记

disc表示实心圆点

square表示实心正方形

circle表示空心圆点

decimal表示数字

2、list-style-image使用图像代替标记

3、list-style-position表示在哪个位置使用标记

4、list-style设置列表属性,通常使用这个属性

3.背景样式

1、背景颜色background-color

①使用英文单词去表示颜色

②使用十六进制的方式表示,并且如果相邻的两两数字相同,可以缩写为一位

③使用三原色的方式去表示,语法:rgb(r,g,b),rgba(r,g,b,a)

r,g,b取值从0~255

a表示透明度,取值从0~1,0表示完全透明,1表示完全不透明

有一个特殊值,transparent表示透明的意思,它是默认值

2、背景图片background-image

url表示的图片路径

3、背景重复方式background-repeat

repeat表示沿水平方向和垂直方向进行重复

no-repeat表示不重复

repeat-x表示沿水平方向重复

repeat-y表示沿垂直方向重复

4、背景位移background-position:X轴方向偏移量 Y轴方向偏移量

①可以使用像素值来表示偏移量,比如:50px 50px;

②可以使用百分比来表示偏移量,比如:20% 50%;

③可以使用英文字母来表示偏移量,比如:center middle;

5、背景属性设置所有的背景样式

6、背景尺寸background-size

①auto表示背景图片保持原样,默认值

②percentage表示背景图片大小根据容器大小的百分比决定大小,只写一个值表示只

对一个值进行设置,另外一个值会根据图片本身的比例等比例缩放

本身比例为4:3

400px 300px

800px 600px

1200px 900px

③直接使用像素值px来设置图片大小,只设置一个值和百分比一样

④cover放大充满整个容器

⑤contain放大充满整个容器,如果有一个方向充满了整个容器,那么不在放大

4.渐变

1、线性渐变

:颜色沿着一条直线过渡

linear-gradient(渐变方向,颜色1,颜色2,颜色n)

不加前缀方向使用“to 方向”表示往哪个方向进行渐变,加上前缀之后使用“方向”

表示从哪个方向开始渐变

2、径向渐变:从一个起点朝所有方向混合

-radial-gradient(渐变方向,颜色1,颜色2,颜色n)

5.浏览器前缀:(避免兼容问题)

IE浏览器前缀-ms-

Chrome浏览器前缀-webkit-

Safiri浏览器前缀-webkit-

Opera浏览器前缀-o-

Firefox浏览器前缀-moz-

七、盒子模型

1.盒子模型:就是一个虚拟的矩形容器

2.盒子模型的组成:

1、content(内容):表示主要内容

2、padding(内边距):表示内容与边框之间的距离

3、border(边框):表示包着内容的外框,边框是有一定宽度的

4、margin(外边距):表示边框外部与其他盒子的距离

3.边框border

1、border-color边框颜色

①使用英文字母来表示颜色

②使用十六进制来表示颜色

③使用三原色来表示颜色,rgb(),rgba()

所有的块元素都是一个盒子模型

border-top-color上边框,border-bottom-color下边框

border-left-color左边框,border-right-color右边框

※※※※※※※

可以使用border-color去设置,可以取1~4个值任意一个

如果设置一个值表示对应所有的方向

如果设置两个值,第一个值表示上边框和它对应边框的值,第二个值表示右边框和它

对应的值

如果设置三个值,第一个值表示上边框,第二个值表示右边框和它对应的值,第三个

表示下边框的值

如果设置四个值,第一个值表示上边框,第二个值表示右边框,第三个值表示下边框,

第四个值表示左边框,按照顺时针的顺序依次设置

2、border-width边框的粗细

使用像素值去设置边框的粗细,网页一般使用这种方式

设置边框颜色的方式一样

3、border-style边框的样式

none表示没有边框

solid表示实线边框

dashed表示虚线边框

dotted表示点线边框

设置边框样式的方式和置边框颜色的方式一样

border边框属性

可以设置边框的所有属性,不需要按照顺序

border-left设置左边框的属性

border-right设置右边框的属性

border-bottom设置下边框的属性

border-top设置上边框的属性

外边距margin

margin-top设置上外边距的距离

margin-right设置右外边距的距离

margin-bottom设置下外边距的距离

margin-left设置左外边距的距离

可以使用margin去设置,可以取1~4个值任意一个

和设置边框颜色的方式一样

使用margin设置盒子居中,语法:margin:0px auto;需要满足两个条件

①必须为块元素

②必须设置盒子的宽度和高度

内边距padding

padding-top设置上内边距的距离

padding-right设置右内边距的距离

padding-bottom设置下内边距的距离

padding-left设置左内边距的距离

可以使用padding去设置,可以取1~4个值任意一个

和设置边框颜色的方式一样

4.盒子模型的尺寸

盒子模型的尺存分为盒子模型的宽度和高度

盒子模型的外盒宽度=内容宽度+内边距的左右宽度+边框左右宽度+外边距左右宽度

盒子模型的外盒高度=内容高度+内边距的上下高度+边框上下高度+外边距上下高度

盒子模型的内盒宽度=内容宽度+内边距的左右宽度+边框左右度

盒子模型的内盒高度=内容高度+内边距的上下高度+边框上下度

5.拯救布局

使用box-sizing拯救布局,有3个值

1、content-box:默认值,表示设置的宽度和高度等于内容的宽度和高度,盒子的宽度和

高度通过计算获得

2、border-box:表示设置的宽度和高度等于盒子的宽度和高度

3、inherit:继承父元素的盒子模型模式

6.圆角边框border-radius:为矩形边框设置圆角效果

语法:border-radius:可以设置1~4个值;

设置一个值会对四个角进行设置

设置两个值,第一个值设置左上角和它对角的值,第二值是设置右上角和它对角的值

设置三个值,第一个设置左上角,第二个设置右上角和它对角的值,第三个设置右下角的值

设置四个值,第一个设置左上角,第二个设置右上角,第三个设置右下角,第四个设置左下角

设置圆形

①必须盒子的宽度和高度相同

②圆角边框的值必须将四个角的值都设置为宽度的一半或者50%

设置上半圆:宽度不变,高度变为一半,第一个值、第二值为一半,第三和第四个为0

设置下半圆:宽度不变,高度变为一半,第一个值、第二值为0,第三和第四个为一半

设置左半圆:宽度为一半,高度变不变,第一个值、第四值为一半,第二和第三个为0

设置左半圆:宽度为一半,高度变不变,第一个值、第四值为0,第二和第三个为一半

扇形:高度和宽度都为一半,需要哪一个方向的就添加哪个角的值,其他都为0

7.盒子阴影box-shadow

语法:box-shadow:inset x-offset y-offset blur-radius color;

第一个参数表示阴影的类型,不写为外阴影,inset表示为内阴影

第二个参数表示阴影的水平偏移量,正数往右,负数往左

第三个参数表示阴影的垂直偏移量,正数往下,负数往上

第四个参数为模糊半径,模糊范围大小,越往外越模糊

第五个参数为阴影颜色

八、块元素与行内(内联)元素

1.块元素与行内(内联)元素的特性

1、块元素:独占一行,并且可以设置元素的宽高(div,h1-h6,p,列表)

2、行内元素:不是独占一行,设置宽高对它不起作用,宽度由元素内容撑开。

2.display:显示(元素以哪种形式进行显示)

1、block:块级元素的默认值,在元素前后会有换行

2、inline:行内元素的默认值,元素前后没有换行

3、inline-block:行内块元素,元素既有行内元素的特性(可以和其他元素显示在同一行)又有块级元素的特性(可以设置宽高)。

4、none:该元素不被显示。

3.float:浮动:使得块级元素排列在同一行

1、left:左浮动

2、right:右浮动

3、none:元素不浮动,按照标准文档流显示

4.clear:清除浮动

1、left:清除元素左边的浮动

2、right:清除元素右边的浮动

3、both:清除两侧

4、none:默认值,不清除浮动

5.解决父级边框塌陷的方法

1、在浮动元素的后面加空div,并且给这个空div设置样式:clear:both

2、给父级设置高度height

3、给父级添加属性overflow:auto;

4、给父级添加伪类after

#father:after{

content:’’;

display:block;

clear:both

}

6.overflow:属性用来处理溢出

1、visible:可见的,内容元素会被显示出来,但是在父级边框的外面

2、hidden:内容元素会被显示在边框里,但是超出的部分会被隐藏

3、scroll:内容元素会被隐藏,但是浏览器会提供滚动条,滚动以显示超出的内容

4、auto:当内容元素超出父级的高度时就提供滚动条以显示超出的内容,若内容未超出就不显示滚动条。

九、定位与动画

1.定位属性:position

1、static:默认值,没有定位

2、relative:相对定位,相对于元素原本的位置进行偏移,元素原来的位置会被保留,浮动元素设置相对定位后,是相对元素浮动以后的位置进行偏移。

3、absolute:绝对定位,相对于离元素最近的已经设置定位属性的祖先元素为基准进行偏移,元素原来的位置不会被保留,如果没有已经定位的祖先元素,则以浏览器窗口为基准进行偏移。

4、fixed:固定定位,以浏览器窗口为基准进行偏移。

5、定位的元素的层级会比未定位的元素的级别更高,相对定位通常用于给父元素设置定位属性,但是不设置不偏移量,结合绝对定位使用,固定定位用于广告栏,返回顶部的图标,楼层导航等。

6、z-index:改变定位元素的堆叠顺序,值为整数,值越大,级别越高,显示在最上面。

2.动画

1、变形

语法:transform:变形函数;

2、平移函数:translate(x,y);x代表水平方向的位移,y代表垂直方向的位移,单位为px;

3、缩放函数:scale(x,y);x代表元素宽度的缩放量,y代表高度的缩放量。

4、倾斜函数:skew(x,y);x代表元素水平方向的倾斜度数,y代表垂直方向的倾斜度数,单位是deg。

5、旋转函数:rotate(x);x代表旋转的度数,为正数时顺时针旋转,为负数时逆时针旋转。

2、过渡transition:是一种动画转换过程,渐慢,渐快等。

语法:transition:过渡样式的属性 过渡花费的时间 过渡函数(过渡的速度) 过渡的延迟时间;

1)使用步骤

A、在元素默认样式中声明元素默认的样式

B、声明元素最终呈现的样式,如悬浮(hover),获取焦点(focus)时的样式

C、在元素默认的样式中添加过渡属性。

3、过渡函数:

1、ease:默认值,由快到慢

2、linear:匀速

3、ease-in:越来越快

4、ease-out:越来越慢

5、ease-in-out:先越来越快再越来越慢

3.动画animation

1、创建关键帧(浏览器兼容前缀是加在@与keyframes中间的)

语法:@keyframes 动画名称{

0%{元素样式}

25%{元素样式}

}

4.调用动画

在元素样式中调用

语法:animation:动画名称 动画次数 动画播放的方向 动画播放状态

1)、动画播放次数:为整数,默认值为1,无限循环infinite

2)动画发生的操作:forwards(向前) backwards(向后) both(既可以向前又可以向后)

3)动画播放状态:running(播放) paused(暂停)

4)动画播放方向:normal(向前) alternate(偶数次向前)