html 常用的body标签归纳

 块级元素与行内元素的区别: 

  所谓块元素,是以另起一行开始渲染的元素,行内元素则不需另起一行。如果单独在网页中插入这两个元素,不会对页面产生任何的影响。
  这两个元素是专门为定义CSS样式而生的。

  块元素可以写入高和款,行内元素则根据自有内容和浏览器窗口比例自适应调节宽和高

 

1 标题标签

  块元素

    

标题1


    

标题2


    

标题3


    

标题4


    
标题5

    
标题6

2  常用小标签

    
    

    

    加粗
    斜体
    下划线
    删除
    

段落标签

3 特殊字符 

     空格        
     大于 >    
     小于  <    
     人民币符号 ¥;
     & &
     版权 ©
     注册 ®

 4 div标签和span标签

  div标签用来定义一个块级元素,并无实际的意义。主要通过CSS样式为其赋予不同的表现。
  span标签用来定义内联(行内)元素,并无实际的意义。主要通过CSS样式为其赋予不同的表现。

  p标签不能包含块级标签,p标签也不能包含p标签。

5  img标签

  图片未加载成功时的提示

6 a标签

  超链接标签

  所谓的超链接是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置,还可以是一个图片,一个电子邮件地址,一个文件,甚至是一个应用程序。

  点我

href属性指定目标网页地址。该地址可以有几种类型:

  • 绝对URL - 指向另一个站点(比如 href="http://www.jd.com)
  • 相对URL - 指当前站点中确切的路径(href="index.htm")
  • 锚URL - 指向页面中的锚(href="#top")

   

target:

  • _blank表示在新标签页中打开目标网页
  • _self表示在当前标签页中打开目标网页

对超链接下划线设置

使用代码"text-decoration"
语法: 
text-decoration : none || underline || blink || overline || line-through 

text-decoration参数: 
none :  无装饰
blink :  闪烁
underline :  下划线
line-through :  贯穿线
overline :  上划线

7 列表 

1.无序列表

  • 第一项
  • 第二项

type属性:

  • disc(实心圆点,默认值)
  • circle(空心圆圈)
  • square(实心方块)
  • none(无样式)

2.有序列表

  1. 第一项
  2. 第二项

type属性:

  • 1 数字列表,默认值
  • A 大写字母
  • a 小写字母
  • Ⅰ大写罗马
  • ⅰ小写罗马

3.标题列表

复制代码
标题1
内容1
标题2
内容1
内容2
复制代码

8 表格

    表格是一个二维数据空间,一个表格由若干行组成,一个行又有若干单元格组成,单元格里可以包含文字、列表、图案、表单、数字符号、预置文本和其它的表格等内容。
表格最重要的目的是显示表格类数据。表格类数据是指最适合组织为表格格式(即按行和列组织)的数据。
表格的基本结构:

    

序号 姓名 爱好
1 Egon 杠娘
2 Yuan 日天

属性:

  • border: 表格边框.
  • cellpadding: 内边距
  • cellspacing: 外边距.
  • width: 像素 百分比.(最好通过css来设置长宽)
  • rowspan: 单元格竖跨多少行
  • colspan: 单元格横跨多少列(即合并单元格)

9 form 表单 

  功能:

  表单用于向服务器传输数据,从而实现用户与Web服务器的交互

  表单能够包含input系列标签,比如文本字段、复选框、单选框、提交按钮等等。

  表单还可以包含textarea、select、fieldset和 label标签。

  

from django.conf.urls import url
from django.shortcuts import HttpResponse


def upload(request):
    print("request.GET:", request.GET)
    print("request.POST:", request.POST)

    if request.FILES:
        filename = request.FILES["file"].name
        with open(filename, 'wb') as f:
            for chunk in request.FILES['file'].chunks():
                f.write(chunk)
            return HttpResponse('上传成功')
    return HttpResponse("收到了!")

urlpatterns = [
    url(r'^upload/', upload),
]

10 input

   元素会根据不同的 type 属性,变化为多种形态。

  type属性:

     单行输入文本

     密码输入框

     日期输入框

      复选框

         单选框

     提交按钮

       重置按钮

      普通按钮

        隐藏输入框

          文件选择框

        可对内容检查是否符合Email格式的字符串

   属性说明:

  • name:表单提交时的“键”,注意和id的区别
  • value:表单提交时对应项的值
    • type="button", "reset", "submit"时,为按钮上显示的文本年内容
    • type="text","password","hidden"时,为输入框的初始值
    • type="checkbox", "radio", "file",为输入相关联的值
  • checked:radio和checkbox默认被选中的项
  • readonly:text和password设置只读
  • disabled:所有input均适用
  • placeholder:  占位符,效果是input框里面有浅色的无法选中的字符

11  select标签 

  属性说明:

  • multiple:布尔属性,设置后为多选,否则默认单选
  • disabled:禁用
  • selected:默认选中该项
  • value:定义提交时的选项值,值由选定option值决定

12 label标签

  定义:

  

  

说明:

  1. label 元素不会向用户呈现任何特殊效果。
  
    用户名
  
  
 
   

13 textarea 多行文本

属性说明:

  • name:名称
  • rows:行数
  • cols:列数
  • disabled:禁用

转载于:https://www.cnblogs.com/yuanji2018/p/9735887.html

你可能感兴趣的:(html 常用的body标签归纳)