常用HTML标签及其属性

目录

一、基本标签

1.标题标签

2.段落标签

3.斜体

4.粗体

5.水平线标签

6.换行标签

 二、特殊符号

 三、超链接

四、锚链接

五、图像标签

六、列表

1.无序列表

2.有序列表 

 3.自定义列表

七、表格 

八、表单

九、多行文本域 


 

一、基本标签

1.标题标签

~

    

Hello world!

Hello world!

Hello world!

Hello world!

Hello world!
Hello world!

结果如图:

常用HTML标签及其属性_第1张图片

2.段落标签

白日依山尽,

黄河入海流。

3.斜体

欲穷千里目,

文字会倾斜

4.粗体

更上一层楼。

文字会加粗

5.水平线标签


登鹳雀楼


 在网页中加入平行线用来区分上下文在网页中加入平行线用来区分上下文在网页中加入平行线用来区分上下文在网页中加入平行线用来区分上下文         

结果如图:                                                               

.

6.换行标签


这是倾斜的

这是加粗的

常用HTML标签及其属性_第2张图片

 二、特殊符号

  空格
> 大于号
< 小于号
" 引号

 三、超链接

在了解超链接之前先要了解相对路径与绝对路径

相对路劲

不带有盘符,通常是以HTML网页文件为起点,通过层级关系描述目标图像的位置。

绝对路径

一般是指带有盘符的路径或完整网络地址。

其他属性:target="目标窗口位置"  

属性值:

_self 自身窗口
_blank  新建窗口

 另外a连接也会下载文件,例如:

  像.docx/.pptx可下载

四、锚链接

跳转     点击跳转会跳转到

五、图像标签

图片不能正常加载时的提示语

六、列表

1.无序列表

           

  •  
  •         

  •  
  •         

  •  
  •         

  •  
  •          ...........       

type属性:

disc 实心圆(默认)
circle 空心圆
square 实心正方形
none

    

1.无序列表

  • html
  • css
  • javascript

如图:

常用HTML标签及其属性_第3张图片

2.有序列表 

           

  1.         

  2.         

  3.         .........

type属性:

1 1,2,3...
a/A 小/大写英文字母(a,b,..)
i/I 小/大写罗马数字(i,ii,...)
    
  1. html
  2. css
  3. javascript
  4. html
  5. css
  6. javascript

常用HTML标签及其属性_第4张图片

 3.自定义列表

       

 

               

 

                

 

                

 

                .....

    

3.自定义列表

web前端基础
html
css
javascript/dd>
服务器端
java
c
c#
python

  常用HTML标签及其属性_第5张图片

七、表格 

      基本语法:

           

标签
跨行跨列 rowspan跨行,colspan跨列
标签 每行被分割为若干单元格使用td定义
表格均有若干行组成使用tr定义
标签
定义表格

跨行跨列:

跨行 rowspan属性规定单元格可横跨的行数
跨列

colspan属性规定单元格可横跨的列数

    
ooo
li li li li li
ma ma ma ma
yuan yuan yuan yuan

常用HTML标签及其属性_第6张图片

 表格美化:

border 设置边框(默认为0)
bgcolor 设置背景色
align 设置表格在网页中的对齐方式(left center right)
cellspacing 设置单元格与单元格之间的距离
cellpadding 设置文字与单元格之间的距离
width/height 表格的宽度/高度

八、表单

表单元素属性:

text,password

text,表单中键入字母、数字等内容。

password,输入密码字段

file file,定义了文件的选择
button 定义了普通按钮
checkboxes,radio

checkboxes,表单复选框

radio,表单单选框

submit,image

submit,定义了提交按钮

image,定义了图片提交按钮

reset 定义了重置按钮
size 元素的宽度,当type为text或password时。
maxlength type为text或password时,输入的最大字符
checked type为radio或CheckBox时,指定按钮是否被选中

 下拉列表:

表单的高级应用:

        1. type="hidden"

                对用户不可见,只是在页面上不显示输入框,虽然隐藏,但是具有form传值功能

        2.readonly="readonly"

                只读

        3.disabled="disabled"

                禁用

语义化表单:

        将form表单放入域中

                域标签:

 

                        域标题:

        eg:

表单练习








性      别:

生      日:



           常用HTML标签及其属性_第7张图片

表单元素标注:

         

        创建

        在

        对应在input中加入  id属性进行关联

        

        
        

xxx.html">

九、多行文本域 

        自我介绍:
        

常用HTML标签及其属性_第8张图片 

rows 设置可见高度
cols 设置可见宽度
maxlength 规定文本区域的最大长度
name 规定名称

 

xxx.html">

xxx.html">

你可能感兴趣的:(前端,html,前端)