黄其威-20201028

知识总结:

表格:表格的行列合并
                表单: action method
                <Input type name value 数据回显
       html5.0:h5->标签(
常见块级标签:textarea,input,img,button)                                       
特点:可以和其他元素保持在在一行,还能能设置宽高)
(常见的行级标签:a,span,strong,u(下划线),em(强调),i(斜体),sub(下标),sup(上标
特点:可以和其他元素保持在同一行,不可以自动换行,但不能设置宽高)
Html中常见行级标签:span、a、em、strong、u ......
    特点:在一行内显示(在一行中可以并列多个行级标签),不能设置宽高属性

Html中常见块级标签:div、p、ul、li、dl、td、dd、h1~h6 ......
    特点:独占一行,能设置width,height属性

Html中常见行内块标签:img、input、textarea ......
    特点:能和其它标签 同占一行(在一行中可以并列多个标签),能设置width,height属性
   css.3.0 乘叠样式表 ->修饰网页
   选择器(镜子):精准选择所要修饰的目标
常用的选择器:
        margin   外边距 
        padding  内边距
        border    边款



  1、标签选择器:使用标签名称作为选择器选中标签设置样式。

  特点: 可以选中多个标签,给一堆标签同时设置样式

  2、类型选择器:在标签中利用class属性设置在样式表中 .类型名{设置样式}

  特点:相当于给标签起了一个别名可以重名。也可以有多个名称

  3、ID选择器:标签中利用ID属性进行设置,在样式表中, #ID{设置样式}

  特点:一个标签有且只有一个ID,且不能重名,前端规范要求,不允许使用ID选择器来设置样式,原因:优先级太高, 不方便其他样式的叠加。
 1、三大基本选择器优先级

  id>class>标签

 2、样式设置不生效的三大原因

  a.设置的样式被其他样式叠加

  设置的样式优先级没有其他样式优先级高

  b.样式属性名写错

  c.样式表中选择器标识符写错

  样式表中选择器之间不能有其他字符,

  如果有,该字符将向下与相邻的选择器构成新的选择器,导致选不中。

  检查方法:在谷歌浏览器的控制台中,选中该标签,查看styles里面的

  选择器,查看那个选择器不存在,那么是该选择器标识符 写法出错。

后代选择器:在后代选择器中,空格代表后代
            格式:父标签 子标签{
                属性:属性值;
                 属性:属性值;
 选择器的优先级
    相同属性下:后代选择器(子选择器)> id选择器 > class选择器 > 标签选择器
文本样式
                 color: red; /*修饰文字颜色*/
    font-size: 30px; /*修饰文字大小*/
    font-family: "宋体"; /*文字类型*/
    font-style: italic;  /*字体的样式*/
    font-weight: bold;    /*字体加粗*/
    letter-spacing: 5px;  /*字体间距*/
    text-align: center; /* 对齐方式*/
    line-height: 300px;  /*行高*/
    /*text-decoration: underline;*/ /*文本划线*/
    text-shadow: 2px 2px 3px yellow ;   /*字体阴影*/
    text-indent: 2em; /*首行缩进*/
背景修饰样式
   background-color: azure;/* 背景颜色*/
    background-image: url(../img/pkq.jpg); /*背景图片*/
    /*background-size:500px 300px ;       /*图片背景的大小*/*/
    background-size: cover;  /* 覆盖  */
    /*background-repeat: no-repeat ; /*背景图片平铺*/*/
/*  background-repeat: repeat-x ; 沿着x轴平铺*/
                  background-attachment: fixed ; /*背景图片固定*/
                   /*background-position:-100px 0 ; /*背景图片平移*/*/
                     opacity: 0.5; /*透明度*/


心得体会:通过今天对HTML的学习,我学到很多东西,在这个过程中也遇到了很多意想不到的问题,不过每一个问题的解决都是我的一次小的进步,并且发现这此实践十分有意义。我本着积极肯干,虚心好学、工作认真负责的态度,让自己以最快的速度融入学习当中,发挥自己特长,学习知识

标签

评论

© 2021 成都云创动力科技有限公司 蜀ICP备20006351号-1