HTML+CSS+JS-入门基础ppt课件

目录，1.html/css/JavaScript, 2.html 3。这是一个没有css的html页面，带有JavaScript的html页面可以用带htmL或HTM扩展的记事本来编写。使用浏览器查看其效果。1.2css代码，html网页H2 font-size :50 p font-size :20 使用CSS这是一个使用css的html网页，1.3JavaScript代码，html网页H2 font-size :50 p font-size :20 使用css和JavaScript字体样式style:italic 警报(“这是JavaScript的功能”)；这是一个使用css和JavaScript的html网页，1.4的角色，css和JavaScript，HTML:超文本标记语言。是网页设计的主要语言。无论网页是否包含动画、多媒体、图形等复杂元素，其基本架构都是HTML。层叠样式表。它是目前唯一的页面布局风格标准，弥补了HTML在页面格式上的不足，帮助用户对页面布局有更多的控制。利用JavaScript开发网络客户端应用程序，实现实时、动态、交互式的页面功能。它的出现使得静态的HTML页面逐渐被客户端可以响应的动态页面所取代。你可以直接用超文本标记语言或者独立地编写CSS和JavaScript代码。分机是。css和。超文本标记语言超文本标记语言是一种用于制作超文本文档的简单标记语言。用超文本标记语言编写的超文本文档称为超文本标记语言文档。HTML或*。html文件名区分大小写的工具，用于浏览html文件：浏览器示例：网景浏览器，微软ie，mazilla火狐，2.1.2 html文档编写方法，手动直接写记事本，等等。存进去。htm.HTML格式，用户必须掌握HTML。使用可视化html编辑器Frontpage、Dreamweaver等。很容易生成过时的代码，2.1.3HTML文档结构，myfirstpagesethismyfthomepage！这是我的第一个网页！2.1.3HTML文档结构，标记(签名)是HTML语言的基本部分，如、和。大多数标签总是成对出现。每对标签通常都有一个开始标签，结束标签总是在开始标签前加一个斜线。属性：HTML标签有它们自己的相关属性，每个属性可以由我们的网页编译器指定一个特定的值。Myfirsthomepage注意：标记不区分大小写。示例可以标记为不带空格，否则浏览器无法识别它们。示例错误代码中的任何空格和回车都无效。插入空格和回车符可以用双引号括起来，也可以不用。属性之间最好没有顺序。属性也可以省略(即默认)。2 . 1 . 3超文本标记语言文档结构标题标记在文档的开头。和之间的内容不会显示在浏览器的文档窗口中，但是这两者之间的元素具有特殊的意义。1:标签定义了HTML文档的标题。和之间的内容将显示在浏览器窗口的标题栏中。2.1.3HTML文档结构-标题(meta)，2:标签定义了网页的一些相关信息，如案例文件的关键字、作者、网页的过期时间等。搜索页面时，这些信息不会显示在浏览器的文档窗口中，以标记搜索引擎检索到的关键字。作者过去常常在文件上做记号。用于标记页面的解码方法。用于自动刷新网页，2.1.3HTML文档结构-(头)元，编写网页，并要求3秒后自动跳转到北方软教育主页。三秒钟后，myfirstpage将自动跳转到北方软教育主页，2.1.3HTML文档结构-正文，表明它是HTML文档内容的主要部分。在和之间通常有许多其他的标记。这些标签和标签属性构成了HTML文档的主要部分。它的主要属性是：1)bgcolorbgccolor属性标记了HTML文档的背景色。例如：bgcolor= # ccfcc 。2)backgroundbackground属性标记了HTML文档的背景图片。可以使用的图片格式是gif、jpg，例如。3)文本文本属性标记了超文本标记语言文档的文本颜色。Text=# ff6666 。文本定义的颜色将应用于整个文档。2.1.3HTML文档结构-正文，2.2基本HTML标记，1。标题标签，2。文本标签，3。段落标签，4。字符标签，5。水平标尺标记，6.HTML注释，6。超链接，7。图像标签，8。可移动的文本，2.2.1标题标签，它可以显示六种大小的标题，即最大，最小的介绍超文本标记语言介绍超文本标记语言介绍超文本标记语言介绍超文本标记语言介绍超文本标记语言介绍超文本标记语言介绍超文本标记语言介绍超文本标记语言介绍超文本标记语言介绍超文本标记语言介绍文本标记语言1。文本颜色.#=rrggbb十六进制数字2。文本字体.#=客户端可用的字体3。文本大小.#=1、2、3、4、5、6、7等。2.2.3。段落级别标记，段落分隔符预格式化标记：html的段落和段落之间有一定的间隙。如果你不想要空格，只想换行符，你需要另一个元素，元素。使用标签预先格式化网页中的文本段落。在输入过程中，按键盘上的回车键生成一个段落。也就是说，浏览器将以文本输入格式显示at heron lodge，有三种标记：2.2.4字符级标记、普通字符级标记、倾斜文本、粗体文本、下划线文本、删除线文本、中间带有文本空格标记的强调文本、2.2.5水平线标记、水平线：设置线宽：设置行长度：设置对齐方式#=左、右：设置行颜色、2 . 2 . 6 TML注释、可插入注释的HTML文档。这不仅方便了程序的调试，也让其他人更容易阅读自己的代码。HTML注释格式是：源代码仍然存在，不能被浏览器解释。注释语句仅用于解释程序中一个句子或一段句子的功能。浏览器将忽略注释语句的内容，并在执行过程中对其视而不见。2.2.7超链接，超链接由锚元素定义。在元素下，有元素属性HREF，其属性值是一个网址，如：超链接到学院如：普通超链接如：普通超链接打开一个新的(浏览器)窗口.2.2.7超链接，超链接路径绝对路径：指文件的完整路径，包括协议、主机地址等。通常用于网站的外部链接。2.2.8图像标签，基本属性是src属性，src属性值是被引用图片的网址。Src属性是必需的。Src的网址可以是绝对地址，也可以是指定宽度的相对地址宽度和指定高度的相对地址宽度。它们的属性值可以是像素或%。定义图片替换文本的方法是：替换文本有两个功能：提示：如果图片下载成功，当鼠标放在图片上时会出现提示文本。替换：如果图片下载不成功，替换文本将出现在图片位置。对齐#=左、右、上、中、下、2.2.8图像标记，图片GIF(图形交换格式)图像(。在HTML文档中支持无损压缩只支持256色JPEG(联合图片专家组)图像。JPG)有损压缩，但这种损失是为了消除一些视觉上不易察觉的部分。一种新的网络图片格式，通常用于保存超过256个彩色图片文件，结合了gif和jpeg的优点。图片文件可以以最小的方式压缩，而不会造成图片失真。支持48位颜色。2.2.8图像标签，图像超链接图像超链接是指整个图像的超链接，当点击图像的任何部分时，这个超链接都会被打开。定义默认超链接的方法是：图像的热区链接热区是有意在图像中划分热区。仅当您单击图像的热点区域时，此超链接才会打开。您需要使用地图标志指定热区。2.2.9移动文本，基本语法.文本移动属性(1)方向：direction=# #=left，right，up，down (2)模式：behavior=#=scroll，slide(仅行走一次)，alternate(来回行走)(:loop=# #=次数；如果未指定，无限(4)速度：滚动=# (5)延迟：滚动=#，2.3.1无序列表。and元素定义的：sportsfooddrinkfriends无序列表的默认符号是一个点。该元素具有类型属性。您可以通过定义不同的类型属性来更改列表中的项目符号。目前，类型属性的属性值有：圆盘(圆)、圆(圆)、正方形(正方形)支持嵌套定义，2.3.2有序列表，sportsdrinkfriends元素定义，也有自己的类型属性，类型属性的属性值有1、a、a、I、I等。例如，我们也可以使用A、B、C来定义列表的起始编号.作为列表的编号元素。如果我们希望列表的第一个数字是5而不是1，我们需要定义元素的start属性来支持嵌套定义。2.4.1表的基本结构、定义表标题、定义表行、定义单元格、定义表行、定义单元格、2.4.1表的基本结构以及元素：表的定义。每个表只有一对和，一页可以有多个表。元素：定义表格的行。一个表可以有多行，因此它不是表所独有的。元素：定义表格的单元格。每行可以有不同数量的单元格，而和之间是单元格的具体内容。应该注意的是，上述三个要素必须并且只能成对使用。没有任何元素，就不能定义表。元素：定义表格的标题行。一个表只能有一个标题行或没有标题行，因此它是唯一的或没有标题行。2.4.2表格属性，表格属性宽度属性：指定表格或表格单元格的宽度。单位可以是%或像素。Height属性：指定表格或表格单元格的高度。单位可以是%或像素。边框属性：表格边框粗细bgcolor属性：指定表格或单元格的背景颜色。背景属性：指定表格或单元格的背景图片。它的属性值是一个网址对齐属性：指定内容(文本、图片等)的对齐方式(左、中、右)。)的表格或单元格。2.4.3单元格属性，单元格属性valign属性：指定内容(文本、图片等)的垂直对齐方式。)在一个牢房里。垂直对齐的属性值包括：顶部：顶部对齐；中间：居中对齐；底部：底部对齐；基线：与基线对齐；对齐属性：指定水平对齐(左、中、右等)。)的内容(文本、图片等。)在一个牢房里。colspan: attribute value指示当前单元格跨越几列行span: attribute value指示当前单元格跨越几行，2.4.4行，行属性1，有效属性：指定内容(文本、图片等)的垂直对齐方式。)在一个牢房里。垂直对齐的属性值包顶部：顶部对齐；中间：居中对齐；底部：对齐底部。基线：相对于基线对齐。2.align属性：指定内容(文本、图片等)的水平对齐(左对齐、居中、右对齐)。)的表格或单元格。3.height属性：指定表格中行的高度。单位可以是%或像素，2.4.5表格嵌套，在它们之间插入表格，实现表格嵌套导航列表、计算机政治、军事和法律文本内容，以及2.4.5表格功能。表格是设计数据和图像布局的常用工具。表格可以用来组织数据和控制页面布局。在制作网页时，为了以某种形式组织网页中的信息，使网页易于阅读和美观，需要设计或进行页面布局。然而，表格可以将网页分成许多任意的矩形区域。表格是网页制作中常用的简单布局工具。表单的功能通常是控制文本和图像的显示，而不是显示表单的边框。例如，2.4.6表单，第一季度，第二季度，1月，2月，3月，4月，5月，6月，100055024015027651240，30002430250012509003400，2.5.1表单，是实现网页和浏览器之间交互的重要手段。表格可以用来收集客户提交的信息。在HTML中，我们可以定义表单，并使它们与服务器端的表单处理程序(如CGI或ASP)协作。我们不会在网页设计课程中涉及编程。表单是网页上的特定区域。这个区域由一对元素定义。2.5.2表单例如，设计一个注册表单，输入姓名、年龄、密码、密码确认、电子邮件、性别、爱好、身份、简历，点击提交按钮提交，点击重置按钮重置。姓名、年龄、电子邮件：文本密码、密码确认：密码性别：无线电爱好：复选框身份：选择简历：文本区域提交按钮：提交重置按钮：重置，2.5.2表格示例，2.5.2表格示例，姓名、密码、密码、性别确认、年龄、男女、电子邮件爱好体育、音乐和美术、学生教师、解放军个人经历，请输入您的简历，2.5.2表格示例，2.5.2表格示例，姓名、密码、性别确认、年龄、男女，2.5表格：的基本语法.动作属性：用于定义表单处理程序(ASP、JSP等)的位置(相对地址或绝对地址)。)。方法定义了将表单结果从浏览器传输到服务器的方法。通常有两种方法：获取和发布。GET有数据量限制，POST没有上述限制，