HTML基础


HTML???

HTML基础

HTML的全称超文本标记语言,它采用一种标记性的语言来完成网页开发

HTML标签

标题标签

h1~h6 ,数值越大,字体越小

这是一号标题

这是二号标题

这是三号标题

这是四号标题

这是五号标题
这是六号标题

文字标签

这是一段文字
//color 设置文字的颜色
//size 设置文字的大小,值为 1~7 
//face 设置文字的字体

文字描述标签

这是一个加粗的标签
这也可以加粗
这是一个斜体的文字
这也是一个斜体
这个也可以是斜体 
我是一个下划线 
这也是一个下划线 
这是一个删除线 这也是一个删除线
标签名 效果
加粗
斜体
下划线
删除线

特殊文字

符号 效果
°; 度数
©; 版权标准C
®; 注册商标R
 ; 空格
<; 小于
>; 大于

上角标和下角标

sup 代表的是上角标

sub 代表的是下角标

x2+y2=z2

log210 = ?

列表标签

有序列表ul

全称叫 ordered list 简称 ol

  1. 第一项
  2. 第二项
  3. 第三项
//type 属性用于设置前面有随列表的符号,分别有如下几个值 //type="1" 代表前面的符号是数字123... //type="A" 代表前面的符号是大写字母ABCD... //type="a" 代表前面的符号是小写字母abcd //type="I" 代表前面的符号是大写罗马文 //type="i" 代表前面的符号是小写的罗马文
无序列表ol

无序列表的全称 unordered list

  • 第一项
  • 第二项
  • 第三项
//type 属性用于设置前面的符号,主要的值有以下几个 //disc 实心圆 //circle 空心圆 //square 实心矩形
自定义列表dl

全称叫 data list 简称 dl

男明星
刘德华
张一山
胡歌
女明星
刘亦菲
奶茶妹
王菲
//dl 可以理解成 data list , dt 可以理解成 data title

详细信息标签details(h5)

展开ul内容

男明星
  • 张一山
  • 刘德华
  • 标哥哥
//details 是一个复合标签,它可以与其它的标签结合起来一起使用才会有效果 //details 标签的下面可以书写
标签,它代表摘要 //details 标签是可以通过鼠标点击以后展开与收缩的 //它是HTML5新出标签,在新版本的浏览器里面会有效果,在旧的浏览器里面可能会存在兼容性的问题

图片标签img

这是图片

img标签属性值

src 属性用于设置图片的地址

alt 属性,当图片不能够正常显示的时候就会显示alt里面内容

width/height 属性用于设置图片的大小

border 属性用于设置图片边框

hspace 用于设置图片水平方向的间距,h的全称叫 horizontal

vspace 用于设置图片垂直方向的间距,v的全称叫 vertical

title 属性用于设置鼠标放上去以后的提示信息,它是所有标签都具备的属性,是一个通用属性

链接标签a

 百度一下,你就知道 

这也是百度
优酷视频
标签a属性值

href 属性用于设置连接的地址,这个地址可以是外这的网页,也可以是自身的网页

target 属性用于设置网页的打开形式,有以下 几个属性

_self 在当前页面打开,默认是这个值

_blank 在一个新的空白窗口里面去打开

_search 在指定的位置打开

_parent 在父级窗口打开

_top 在顶级窗口里面去打开

表格标签table

学生信息表

姓名 性别 爱好
张珊 看书
表格属性值
tr 是表格的行,理解为 table row 
td 是表格行里面的数据,理解为 table data 
th 是表格的标题行里面使用的,它会自动加粗并左右居中
colgroup , col 标签是用于设置表格的列的情况的,它不设置具备的内容,只设置样式
border 属性用于设置表格的边框
cellspacing 用于设置单元格的间距(什么是单元格,单元格就可以理解为td) 
cellpadding 用于设置单元格的内间距
align 属性用于设置水平对齐方式,它有 left/center/right 三个属性值,如果设置在
table上面则是表格居中,如果设置在td上面则是单元格内容居中
valign 用于设置垂直对齐方式,它有三个属性值 top/middle/bottom 上中下三个
width/height 用于设置宽度与高度
bgcolor 用于设置背景颜色,它可以设置在table/tr/td上面
rowspan 代表行的合并
colspan 代表列的合并

分割线标签hr


hr标签属性

color 用于设置线条的颜色

width 用于设置线条的长短

align 用于设置线条的水平排列

换行标签br

进度条标签


progress如果没有设置value与max属性,则会看到一个进度块左右滑动

value 属性用于设置进度条的当前值, max 属性用于设置最大值

仪表进度条

 
  

min 代表最小值, max 代表最大值, value 代表当前值

low 用于设置低区间的范围, high 用于设置高区间的范围

optinum 用于设置最优值