HTML
---恢复内容开始---
1.什么是HTML?
超文本标记语言,是一种用于创建创业标记的语言
本质上是浏览器可以识别的规则,我们按照规则写网页,浏览器根据我们提供的规则对网页进行渲染
但可能不同的浏览器对同一个标签的解释会有所不同,出来的效果也有所差别
2.各个标签
<!DOCTYPE html> #声明该文档是HTML5文档
<html lang="en"> #html是文档开始结束的标记,HTML语言选择为英文
head部分
<head> #<head>定义了HTML文档的开头部分,包含元(meta)数据,配置信息
但这些信息是提供给浏览器看的,用户看不到
<meta charset="UTF-8"> #声明编码
<!--<meta http-equiv="refresh" content="2;URL=https:www.oldboyedu.com" charset = "UTF-8">-->
#meta的属性http-equiv,相当于文件头,想浏览器提供有用信息,与content组合使用
#refresh刷新,2相当于过2秒,URL相当于两秒后刷新到这个网页,如果不写,本网页自己 刷新
<!--<meta name = "keywords" content="meta总结,html meta" charset = "UTF-8">-->
#meta的属性name,用于对网页的描述,与content组合使用,用于设置搜索引擎
<title>这是我的网页</title> #<title>定义网页的标题
body部分:
1)字体的操作:<b>加粗 <i>斜体 <u>下划线 <s>删除
2)段落标签:<p>
3)标题标签:<h1>
4)特殊符号:空格 大于号> 小于号<
&符号& ¥符号¥ 版权标识© 注册®
5)div标签:无特别意义,用来定义一个块级元素,独占一行
span标签:无特别意义,用来定义一个行内元素,不需另起一行
6)img标签:src = '图片路径'
alt='图片为加载成功时的提示'
title="鼠标悬浮时提示信息"
width="宽" height="高(宽高两个属性只用一个会自动等比缩放)">
7)a标签:href 指定目标网页地址 ,地址有 绝对URL,相对URL,(锚URL(不常用))三种类型
target 在新的窗口打开目标网页---_blank
target 在旧的窗口打开目标网页---_self
8)列表:1.无序列表
<ul type='disc'>
<li>第一项</li>
</ul>
#type可以设置列表前面标点的类型:disc圆点,circle空心圆圈,square方块,none无样式
2.有序列表
<ol type="1" start="2">
<li>第一项</li>
<li>第二项</li>
</ol>
#type设置列表前缀类型:1数字,A大写字母,a小写字母,I大写罗马,i小写罗马
#start确定从哪一项开始
9)表格: table border表格边框 #可在table后面设置表格属性,border表格边框,cellpadding内边距,cellspacing外边距,width 像素,rowspan 单元格竖跨多少行,colspan单元格横跨多少行
thead 标题部分
tr 一行
th 标题内每单元格的内容
tbody 内容部分
tr 一行
td 每个单元格对应的具体内容
10)input:
text 文本的输入
password 密码输入
date 日期输入
checkbox 多选框 name属性,让多选框有个共同的名字
radio 单选框
submit 提交按钮 value = '按键内容'可更改
reset 重置按钮
button 普通按钮 value = '按键内容'可更改
hidden 隐藏输入框
file 文件选择框
属性说明
name: 表单提交时的"键",注意和id 的区别
value: 表单提交时对应项的值
checked: radio和checkbox默认被选中的项
readonly: text和password设置只读
disabled:所有input均适用
11)form标签
1.功能:表单用于向服务器传输数据,从而实现用户与Web服务器的交互
2. 它能包含input 系列标签,例如:文本字段,复选框,单选框,提交按钮等.
也包含textarea,select,fieldset和label标签.
3.表单属性
12)select 选择标签
1.结构
select
option 选项内容
2.属性说明
multiple:布尔属性,设置后为多选下拉框,否则默认单选
disabled:禁用
selected:默认选中该项
value:定义提交时的选项值
13)lable标签
为input元素定义标注,给用户一些提示
说明:1.label元素不会向用户呈现任何特殊效果,但是点击label标签里的文本,那么和他关联的input标签就获得了光标
2.label标签的for 属性值应当与相关元素的id属性值相同
14)textarea多行文本
属性说明:
name:名称
rows:行数 #相当于文本框高度设置
cols:列数 # 相当于文本框高度设置
disabled:禁用
浙公网安备 33010602011771号