前端1-----块级标签(独占一行),排版标签(样式排版),其他标签,form表单(input的多种类型)...

前端1-----块级标签(独占一行),排版标签(样式排版),其他标签,form表单(input的多种类型)

一丶HTML块级标签

排版标签

p 标签: 段落标签,会自动在段落上下加上空白来分开
    p标签是一个文本标签,本身是一个块级标签不能再嵌套块标签
    
div 标签: 没有样式的标签 ,最常用

列表

​      1.无序列表 常用

      2.有序列表

      3.标题列表

# 无序列表  circle:空心圆, disc:默认实心圆,square:实心方片
    

        
1
        
2
    

    

        
1
        
2
    
    
    

        
1
        
2
    

# 有序列表 ol ,type:阿拉伯数字和英文字母. start :从第几个开始
    

        
1
        
2
        
3
        
4
    

# 标题列表
  
    
标题
     
    
1
     
    
2
    
3

表格

table 表格:
        thead :表头
             tr: 一行
            th: 一列 , 加粗的单元格。相当于 + 
            ：表格的标题。使用时和tr标签并列
        tbody: 表身
            tr:一行
            td:一列
表格属性:
            width : 宽度
            height: 高度
            bordercolor: 边框颜色
            border : 边框
            align :表格的水平对齐方式
            bgcolor : 背景颜色
            background : 背景图片
            cellspacing :单元格和单元格之间的距离（外边距），像素为单位。默认情况下的值为0
            cellpadding :单元格内容到边的距离，像素为单位。默认情况下，文字是紧挨着左边那条线的，即默认情况下的值为0。注意:注意不是单元格内容到四条边的距离哈，而是到一条边的距离，默认是与左边那条线的距离。如果设置属性dir="rtl"，那就指的是内容到右边那条线的距离。

合并单元格:
            colspan：横向合并。例如colspan="2"表示当前单元格在水平方向上要占据两个单元格的位置。
            rowspan：纵向合并。例如rowspan="2"表示当前单元格在垂直方向上

tr属性:
            dir：公有属性，设置这一行单元格内容的排列方式。可以取值：ltr：从左到右（left to right，默认），rtl：从右到左（right to left）
            bgcolor：设置这一行的单元格的背景色。
            height：一行的高度
            align="center"：一行的内容水平居中显示，取值：left、center、right
            valign="center"：一行的内容垂直居中，取值：top、middle、bottom

td属性:
            align：内容的横向对齐方式。属性值可以填：left right center。
            valign：内容的纵向对齐方式。属性值可以填：top middle bottom
            width：绝对值或者相对值(%)
            height：单元格的高度
            bgcolor：设置这个单元格的背景色。
            background：设置这个单元格的背景图片。

      具体代码如下:?

    
    



    

        


    
这里是表格的标题哦~~
    

    

        
第一列
        
第二列
        
第三列
    
    
    

            
1
            
            
2
        
        

        
            
一
            
二
            
三
        
        

            
B
            
C
        
    

form表单

### input 框 全家桶

        text 单行输入文本
        password 密码输入框（不显示明文）
        radio  单选框 (name属性相同:则是互斥效果)
        checkbox  复选框
        email     邮箱框
        date      日期输入框 ,年月日
        datetime-local 日期输入框, 年月日时分
        file      文件
        submit     提交按钮
        reset       重置按钮
        hidden      隐藏文本框
        
### 常用的属性
        id : id值
         name :属性设置值,
         value :属性设置值  ,
         readonly : 只读并可提交,
         disabled : 只显示不可提交 ,
         size="50" : 表示文本框内可以显示五十个字符。
         placeholder : 背景提示
         checked : 默认选择状态
         title : 鼠标悬浮
         for : 绑定id

      具体代码如下:?

    
    






    


     


      


      




    男
    女
 


    唱
    跳
    rap

    


    
    
     



    

    

    


    
    
    
    


    提交数据按钮

排版标签

      p:段落标签

      div:没有样式的块级标签

      代码如下:?

    
    


    



    123
    
1


    
    

    P内容0


    P内容1


    P内容2


    div内容3


    div内容4


    div内容5


123居中

          鹅鹅鹅
            作者：李白
        曲项向天歌
        白毛浮绿水

其他标签

      select:下拉选择框

      textarea:文本域

      label:文本标签

      代码如下:?

    
    
    
    




    北京
    上海
    天津
    重庆
    长春





    唱
    跳
    rap
    篮球
    ?


    



姓名:




    短时空间的





    

        
账号信息
        姓名:
        
        

    


    
    

转载于:https://www.cnblogs.com/dengl/p/11324511.html