web前端基础知识——HTML常用标签篇(二)

7、图片标签:

img src属性是图片的路径(远程 或者相对)  alt  属性是图片加载失败的时候显示的内容。

属性  align   作用的是图片, 效果是后边的文字对齐。

代码如图:(这里用的是远程链接的图片)

web前端基础知识——HTML常用标签篇(二)_第1张图片

网页效果如图:

8.列表标签:

  •   有序列表   ol li  
  •   无序列表   ul li

  二者可以相互嵌套

代码如图:

web前端基础知识——HTML常用标签篇(二)_第2张图片              web前端基础知识——HTML常用标签篇(二)_第3张图片

网页效果图:

web前端基础知识——HTML常用标签篇(二)_第4张图片                      web前端基础知识——HTML常用标签篇(二)_第5张图片

9、区块标签:

  div

相当一个容器  主要用来做网页的框架布局  
span 标签  专门放置文字的标签

代码如下:

web前端基础知识——HTML常用标签篇(二)_第6张图片

网页显示效果如下:

web前端基础知识——HTML常用标签篇(二)_第7张图片

10、input  标签

  属性:type  决定当前的input标签的类型
  没有type属性的时候  默认单行文本框
  value 属性是input 标签的值(radio  value  也是给代码使用的把多个radio做成单选框  给radio起相同的名称)
  type属性值:
  text  代表的是单行文本框(text  password   属性maxlength  输入的最大长度)
  password  代表密码框
  checkbox  代表复选框(checkbox  value属性 不是界面显示的   是给代码使用的 checkbox  默认属性   checked)

  表单元素标签  form  做用户注册或者登陆
  属性action  提交表单的数据到后台的路径
  method  属性  表单提交的方式   get 显示提交(不安全   数据量大)   post  隐式提交(安全   数据量小)
  delete  专门针对于  删除操作的时候 使用
  insert  专门针对于   增加造作
  update   专门针对   修改操作

下面是由input等基础标签做的一个小案例:

代码如图:
web前端基础知识——HTML常用标签篇(二)_第8张图片   

web前端基础知识——HTML常用标签篇(二)_第9张图片

网页效果如图:

web前端基础知识——HTML常用标签篇(二)_第10张图片

 

 

 

 

 

 

 

 

 

 

 

 


 

 

 

 

 

 

 

你可能感兴趣的:(web前端基础知识——HTML常用标签篇(二))