初识Html
骨架组成
英文感叹号!加回车 快速搭建页面
<!DOCTYPE html>document type文档类型 html 超文本标记语言
<html lang="en">html 根标签 language 语言 en English 英文 zh—CN 中文
<meta charset="UTF-8"> charset 字符集 UTF-8 编码格式 也称为万国码
<html></html>根标签
<title></title>网页的标题
<head></head>网页的头部标签
<body></body>网页的身体/主体 所需要想页面展示的内容 都写在body里面
块标签(block)
1.上下排布 2.独占一行 3.可以设置宽高 4.自动换行
<p>段落标签</p>
:段落文字使用,默认段尾进行换行
<div>可以嵌套任意标签</div>
:划分块的主要标签
<ul>无序列表</li>
:无序标签,后面的标号为黑色圆点
ul li 不能分来使用 必须在一起
ul里面只能嵌套li,li里面可以嵌套任何标签
<ol>有序列表</li
:有序列表,后面的标号为1,2,3,4,..
ol里面只能嵌套li,li里面可以嵌套任何标签
<h1>标题标签</h1>
....
逐级递减
...
<h6>标题标签</h6>
:h1~h6为标题标签,字体的大小逐级变小
<br>换行标签
:换行标签,作用使代码效果被迫换行
<hr>水平分割线
:水平分割线,作用在代码下方产生一条水平分割线
<form action="">表单</form>
: 1.action是指把收集的数据 提交给哪一个服务器 里面填写服务器的地址
2. select 下拉菜单 属性值:option selected默认选中
3 textarer 文本域
3.1. rasize=none 禁止缩放
3.2. rasize=horizontal 水平缩放
3.3. resiae:vertical 垂直缩放
3 4. resiae:both 水平垂直缩放
<dl></dl>
dt 表头
dl 自定义列表
dd 文本内容
1. 对一个事件,时间点,名词等解析说明
2. 是一组标签 dl+dt+dd
3. t和 dd里面可以嵌套任何内容
行标签(inline)
1.左右排布 2.不独占一行 3.宽高受到限制时,被迫换行 4.不可以设置宽高
<span>文本标签</span>
:主要用来对行内的文字进行一些样式以及其他的操作;
<em>斜体标签</em>
:一般对文字进行强调,用斜体体现出来
<strong>加粗标签</strong>
:一般对文字进行强调,用粗体体现出来
<del>删除线标签</del>
:删除线,在文本上产生一条删除线,只是语义上的删除;
<a href="">超链接</a>
1. :用来链接其他网页
2. 外链跳转href里面书写需要跳转的地址
3. 内部跳转 跳转到自己的文件夹里面 ./当前路径下;../上一级路径
4. '#'空链接 不做任何的链接和跳转
5. traget:_black 在新页面中打开
<label for=""></label>
1.常用于绑定内容与表单标签的关系
2.此时点击用户名,可以让输入框获取焦点
-->
行内块标签(inline-block)
1.左右排布 2.不独占一行 3.宽高受到限制被迫换行 4.可以设置宽高
<img src="" alt="">插入图片标签</img>
:图片引用标签,其中src属性中写入图片的地址。
title鼠标停留在图片上的提示语句
alt 图片未加载成功的提示语句
<input>表单标签</input>
属性:
1. text 插入文本
2. password 密码
3. checkbox 复选框
4. placeholder 提示用户输入内容
5. radio 单选框 为了实现可以n选一需要给每一个属性为radio的input标签添加name属性,保证name的值是一样的
6. rest 重置按钮
7. submit 具有提交功能的按钮,如果不加value属性,默认为提交按钮
8. file 提交文件
9. autofocus 自动获取焦点
10. readonly 只能读,不能更改和添加内容
11. checked 添加后 刷新页面自动勾选
表格样式(table)
- tr 表格
- th 表头
- td 表格单元
- border边框
- width 宽度
- height 高度
- cellpadding 规定单元格边沿与其内容的空白
- cellspacing 规定单元格之间的空白
- rowspan 列合并
- colspan 行合并
- caption 定义表格的大标题 书写在table内部