一.html
超文本标记语言 hypertext markup language
二.html的结构
三.html标签格式
1.标签由<>把关键字括起来
2.标签通常是成对出现的 , eg <div></div> 第一个开始标识,第二个有/的是结束标识
<标签名 属性1="值1" 属性2="值2">内容部分</标签名>
3.标签也有单独出现的, eg <br/>,<hr/>
<标签名 属性1="值1" 属性2="值2"/>
四.html的属性
1.id 定义标签的唯一id
2.class 为html元素定义一个或者多个类名
3.style 规定行内的样式
五.body中的常用标签
1.标签的嵌套
通常块级标签可以包含内联标签,但是内联标签不能包含块级标签,p标签比较特殊,不能包含p标签也不能包含块级标签
2.行内标签
<b>加粗</b> <i>斜体</i><u>下划线</u><s>删除</s>
3.块级标签
<p>段落</p><h1>一级标题</h1><h2>二级标题</h2> ?# 共有6级标题
4.特殊字符
空格 ??????? < ??????????< ???> ???????????>& ???????????&版权符 ????©注册符 ?????®
5.div标签
div标签用来定义一个块级标签,通过css来修改样式
6.span标签
span标签用来定义一个内联标签,通过css来修饰样式
7.img标签
img标签是用来定义图片的
<img scr="图片的路径" alt="图片未加载出来时的提示" title="鼠标停留时显示的信息" width="宽度" height="高度">
8.a标签
a标签是定义超链接的
<a href="url(或锚)" target="_blank">点我</a> ???????锚 指向页面中的锚(href="#top") 跳转target属性 ????_blank 在空白页打开 ??????????????????_self 在当前页面打开,默认的 ????
9.ul标签
ul是一个无序的列表
<ul type="disc"> ???<li>第一项</li> ???<li>第二项</li><ul/>type属性: disc ???实心圆(默认) ???circle ??空心圆 ??????????????square ??实心方块 ???????none 什么都没有
10.ol标签
ol是一个有序列表
<ol type="1" start="2"> ???<li>第一项</li> ???<li>第二项</li></ol>type属性 ???1 数字列表(默认) ?A 大写字母 ?a 小写字母 ???I 大写罗马数字 ???i 小写罗马数字
11.dl标签
dl是标题列表
<dl> ????<dt>标题</dt> ??????<dd>内容</dd></dl>
12.table标签
table表格标签
<table border="1"> ???<thead> ???<tr> ???????<th>id</th> ???????<th>name</th> ???????<th>hobby</th> ???</tr> ???</thead> ???<tbody> ???<tr> ???????<td>1</td> ???????<td>alex</td> ???????<td>chi</td> ???</tr> ???</tbody>
table属性
border 表格边框
cell padding 内边距
cell spacing 外边距
width 宽度
td属性
rowspan 合并行(上下合并)
colspan 合并列(左右合并)
13.input标签
<input type="text">
type属性
其他属性
name:表单提交时的键
value:表单提交时对应的值
type="button" "reset" "submit" 为按钮上显示的文本内容
type="text" "password" "hidden" 为输入框的输入的值
type="checkbox" "radio" "file" 为输入相关联的值
14.select标签
<select name="" id=""> ???<option value="1">选项1</option> ???<option value="2">选项2</option></select>
属性
multiple:设置为多选
disabled:禁用
selected:默认
value:定义提交时的选项值
15.label标签
包含input标签,提示输入框,输入后变成黄色
<label>用户名: ???<input type="text" name="username"></label>
16.textarea标签
<textarea name="memo" id="memo" cols="30" rows="10"> ???默认内容</textarea>属性 ???name: 名称 ???rows: 行数 ???cols: 列数 ???disabled: 禁用
16.form标签
用于向服务器传输数据,从而实现用户与web服务器的交互
包含 input select label textarea
属性
前端html的简单认识
原文地址:https://www.cnblogs.com/q767498226/p/10312103.html