前端(二)

一、昨日的补充

Head中的补充内容
<meta name=“keywords” content=“关键1 ,关键2.。。关键n”/>

定义网页的关键字 关键字可以写n个 最好的个个数是8个
:如果没有关联的化 百度认为这个网页作弊,会被封锁,用户就会搜索不到
最严重的时候可能会永久的入不了百度

<meta name=" description" content=“定义网页的描述信息”/>

定义网页的描述信息
总结:以上两点主要是针对搜索引擎,描述不在网页中显示,一般是在120个之内。

二、图像和链接

三种表现方式(三种)
1、绝对路径

从文件所在的最高级目录下开始的完整路径

分类:

1.访问互联网上的资源
协议名称+主机名(IP地址/域名)+目录的路径和文件名
在这里插入图片描述
2.访问本机的资源
真正存在的物理路径:盘符一直到资源文件经过的路径
在这里插入图片描述

2、相对路径

从文件所在的位置开始查找 资源文件所在的位置经过的路径

分类:

1.当前文件与资源文件在同目录下
直接通过名称进行引用
在这里插入图片描述
2.资源文件在当前文件的字目录中
先进入这个文件夹再引用
在这里插入图片描述
3.资源文件在当前文件的父目录中
先返回再引用 …/ 返回上一级
在这里插入图片描述

3、根相对路径(服务器上使用)服务器上才能够用的到
		表现形式  /作为开始
4、图像:
		在web中所支持的图像格式有哪几种?
			1.jpeg .jpg  压缩 有损
			2.png 无损压缩  支持透明色
			3.gif 动图
5、图片元素
		<img>
		src:指定要显示的图片的url
		alt:当图片无法显示的时候用文字去解释它
		width:宽度
		height:高度
			注意:如果只改变 width或者height中一个属性的化 那么另一个属性会跟着等比缩放
		title:当鼠标指向时提示的文字
6、链接

<a>内容
href:链接的url
traget:指定打开新网页的形式
_self:在原网页中跳转
_blank:在新网页中跳转
超链接的第二种用法
锚点
在网页的任意位置处做个记号,可有任意位置的a标签跳转到该记号上
使用方式:
第一步: 定义锚点 (做记号)
1.用a标签做记号
2.用其他的标签做记号
给其他的标签加上一个 id
第二步:链接到锚点
href属性 用#开头后面写记号的名字
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

三、表格

1、表格的作用
	按照一定的格式摆放数据
	表格是由一些被称为单元格的矩形框组成,按照从左到右,从上到下的顺序。
2、表格的创建
	创建一个表格
		1、定义表格
		2.创建行 tr
		3.创建单元格 td
		表格的属性
	table
		1.boder 边框
		2.cellpadding  单元格的内边距(单元格边框与内容之间的距离)
		3.cellspacing  单元格的外边距(单元格和单元格之间的距离)
		4.width  宽度
		5.height 高度
		6.align 调整水平位置
		7.bgcolor 背景颜色
	tr
		1.align 调整内容水平对齐方式
		2.valign 调整内容垂直对齐方式
		3.bgcolor 背景颜色
		
	td
		1.width 宽度
		2.height 高度
		3.align 水平对齐
		4.valign 垂直对齐
		5.colspan 横向合并单元格 后面写的数值包含自己 并且我们合并掉的单元格要删除
		6.rowspan 纵向合并单元格 后面写的数值包含自己 并且我们合并掉的单元格要删除
	<caption>日常九宫格</caption>
		表格的标题 默认:表格上方居中位置
		每个表格最多只能有一个标题(约定俗成)但是可以写多个标题
	复杂表格的用法
		行分组
		html中允许将表格内容划分为三个部分
			1.表头行部分
				<thead></thead>
			2.表主体部分
				<tbody></tbody>
			3.表尾行分组
				<tfoot></tfoot>
				
		注意:每个行分组中,都允许包含一对或者多对 tr标签

四、列表

1.作用

默认显示方式为 从上到下显示

2.列表的组成

列表类型 列表项
列表类型 ul(无序列表) ol(有序列表) dl(自定义列表)

3.列表的使用

1.无序列表
<ul>
        <li></li>
</ul>
2.有序列表
<ol>
        <li></li>
</ol>
3.自定义列表
<dl>
        <dt></dt>
</dl>
在这里插入图片描述

五、结构标签(语义化标签)

<header></header>
作用:定义文档的页眉
用于取代<div id=“header”>
<nav></nav>
用于表示页面中的导航部分
<section></section>
用于表示页面中的主体部分
<footer></footer>
用于表示页面中底部部分
<article></article>
独立于文档的其他部分内容
<aside></aside>
表现于网页中边栏信息

六、表单

1.表单的作用
用于显示、收集用户的信息,并且将信息传给服务器
2.表单的组成’
表单元素-负责将用户数据提交给服务器
表单控件-负责接收用户的数据(与用户进行数据交互)
3. 表单元素-负责将用户数据提交给服务器
1.用法
<form></form>
表单属性
action
定义表单被提交的时候的动作,主要就是服务器上处理数据应用程序的URL找谁处理
method
get
向服务器端提交数据时使用
特点:显示提交 用户数据可以显示在地址栏
提交数据长度有限制-2kB 每个浏览器时不一样
谷歌 8kB ie 2kb
post
隐式提交 所有提交数据的时候都是看不见的 相对于说安全性较高
没有数据大小限制的
表单数据进行编码的方式
默认: application/x-www-form-urlencoded
mulipart/form-data 上传文件时使用的
text/plain 早期的一个编码方式 非常少见了

表单的控件
					type:
					创建各种类型的输入字段,如
					文本框(text)
					密码框(password) 
					单选按钮(radio) 
					多选按钮(checkbox) 
					提交按钮(submit) 
					重置按钮(reset)。。。
					value:
						值  要提交给服务器的
					name:
						控件的名称 服务端使用的 没有名字的话是无法提交的
					disabled="disabled
						禁用控件
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值