本帖最后由 小石姐姐 于 2018-10-26 09:53 编辑
HTML 今日内容 Web开发常用的两种架构 JavaWeb:使用Java语言基于互联网的项目 软件架构 C/S架构: Client/Server 客户端/服务器端 在用户本地有一个客户端程序,在远程有一个服务器程序 优点: 用户体验好 缺点: 开发,安装,部署,维护麻烦 B/S架构: Brower/Server 浏览器/服务器端 只需要一个浏览器,用户通过不同的网址(URL)访问远程不同的服务器端程序 优点: 开发,安装,部署,维护简单 缺点: 如果应用过大,用户的体验可能会受到影响 对硬件要求过高 B/S 架构详解: 资源分类 静态资源:使用静态网页开发技术(HTML,CSS,Java Script)发布的资源 特点: 所有用户访问,得到的结果是一样的 如: 文本,图片,音频,视频,HTML,CSS,Java Script 如果用户请求的是静态资源,那么服务器会直接将静态资源 发送给浏览器,浏览器内置了静态资源解析引擎,可以展示静 态资源 动态资源: 使用动态网页技术发布的技术 特点: 所有用户访问,得到的结果可能不一样 如:jsp/servlet/php/asp... 如果用户请求的是动态资源,那么服务器会去执行动态资源,转换为 静态资源,再发送给浏览器 结论:我们要学习动态资源,必须先学习静态资源 静态资源: HTML: 用于搭建基础网页,展示页面内容 CSS: 用于美化页面,布局页面 JavaScript: 控制页面的元素,让页面有一些动态的效果 HTML概述 Hyper Text Markup Language超文本标记语言 概述:是最基础的网页开发语言,作用编写网页 超文本: 超文本是用超链接的方法,将各种不同空间的文字信息组织在一起的网状文本 标记语言: 由标签构成的语言 <标签的名称> 如html,xml 标记语言不是编程语言 HTML快速入门 语法:文件后缀名是以.html或者.htm结尾 <html></html>:根标签 : 标记整个html的网页范围 Html里边有一个头标签<head> : 设置网页的信息,比如网页的标题,网页的编码格式 Html里边有一个体标签<body> : 显示在网页的内容 如下: [Java] 纯文本查看 复制代码 <html>
<head>
<title>标题</title>
<metacharset = “urf-8”>
</head>
<body>
<font size =“6” color = “red”>hello</font>
</body>
</html> 标签分为 围堵标签:有开始标签和结束标签 如: <html></html> 自闭和标签: 开始标签和结束标签在一起 如: <br /> 换行标签 标签可以嵌套: 需要正确嵌套,不能你中有我,我中有你 Eg:<a><b></b></a> 在开始标签中可以定义属性. 属性是由键值对构成,值需要用引号(单双都可)引起来 属性可以改变内容的显示效果 Html的标签不区分大小写,建议使用小写 网页显示内容 文本,图片,音频,视频,超链接(点击跳转的就是超链接)等等 Txt文档上显示的内容:文本 HTML常用的标签 文件标签: 构成html最基本的标签 Html: html文档的根标签 Head: 头标签.用于指定html文档的一些属性.引入外部资源 Title: 标题标签 Body: 体标签 <!DOCTYPEhtml>:html5中定义该文档是html文档 文本标签: 和文本有关的标签 注释: <!-- 注释内容--> <h1> to<h6> : 标题标签 <h1>黑马旅游网</h1>,h1到h6字体大小逐渐递减,自带换行效果 <p>: 段落标签 <br>: 换行标签 <hr>: 显示一条水平线 <hr/>,也是自闭和标签 Color:颜色 Width:宽度 Size:高度 Align: Center:居中 Left:左对齐 Right:右对齐 [HTML] 纯文本查看 复制代码 <hr color = ‘red’ width = ‘200’ size = ‘10’ align = ‘left’ /> :颜色红色,宽度200,高度10,对齐方式左对齐 <i>: 字体斜体 <u>: 下划线 <font>: 字体标签 Color:颜色 Size:大小 Face:字体样式(楷体,宋体等等) 属性定义: Color: 英文单词:red,green,blue Rgb(值1,值2,值3): 值的范围0~255;如 rgb(0,0,255) #值1值2值3: 值的范围是00~FF之间 如 #0000FF Width: 数值: width = ‘20’ ,数值的单位是px(像素) 数值%: 表示占比,相对于父元素的比例 <center>:居中标签 特殊字符:空格字符: 图片标签: 自闭和标签 Img:展示图片 <img /> Src:指定图片的位置 相对路径:以.开头的路径 ./:代表当前目录 ./image/1.jpg ../:代表上一级目录 如果图片在网页的下一级目录,则用 src = ./image/1.jpg 如果图片在网页的上一级目录,则用src = ../image/1.jpg 如果html文档和图片位于同一目录下,那么路径直接写图片名称即可 Src = “1.jpg” 列表标签: 有序列表(order list) : <ol><li></li></ol> 无序列表(unorder list) : <ul><li></li></ul> 链接标签: <a href = “跳转的资源位置”>内容</a> 属性: href: 指定访问资源的URL(统一资源定位符) Target: 指定打开资源的方式 Target=”_self” : 默认值,在当前页面打开 Target = “_blank” : 在空白页面打开(在新的页面打开) <a href = “./4._列表标签.html”>点我</a> <a href = “mailto : 邮箱名” >联系我们</a> <a href = “资源位置”><img src = “图片位置/图片.jpg” /></a> Href属性的值分为两种情况 第一种情况:跳转到其他网站的资源:带http Eg:跳转百度 href = “http://www.baidu.com” 第二种情况:跳转到自己网站内部的资源:不需要带http 相对路径的写法: 同一级目录,上一级目录,下一级目录 块标签: Div: 每一个div占满一整行.块级标签 Span: 文本信息在一行展示(行内标签,内联标签) 语义化标签: html5中为了提高程序的可读性,提供了一些标签 <header></header>页眉 <footer></footer>页脚 表格标签: <table></table>:定义表格 Width: 宽度 Border: 边框 Cellpadding : 定义内容与单元格之间的距离 Cellspacing : 定义单元格之间的距离,如果定义为0,则单元格之间的线合为一条 Bgcolor:背景色
| 
收藏
淘帖
踩
