zoukankan      html  css  js  c++  java
  • H5基础知识点总结9月13日

    面试题

    为什么两个P出此案的效果不同,原因是 浏览器在解析第二个P的时候,因为字母没有空格,浏览器会认为这个单词没有打完,所以不会换行。

    列表 ul ol dl li

    1、无序列表 ul

    (1)内部必须有子标签<li></li>

    (2)ul天生自带外边距  <p>也是自带外边距

    ◇list-style 样式属性 可以清楚列表前面的符号

    list-style的属性值:circle/disc/square/none

    ◇并集选择器,用英文状态下的逗号隔开

    ◇*选择器,优缺点

    优点:省事

    缺点:增加了浏览器的负荷

    解决办法:按需选择

    2、有序列表 ol

    (1)内部必须有子标签<li></li>

    (2)天生自带内外边距

    ◇ul和ol的区别主要在于前面的符号

    ol前面的符号属性更改在标签里

    <ol type="A"></ol>

    3、自定义列表 dl

    dl dt dd(自定义列表 小标题 内容

    ◇列表可以做什么:二级菜单 导航

    ;◇有关margin和padding问题的探讨

    (1)margin:200px;只设一个值,它的上下左右边距都是200px

    (2)margin:200px 100px;设两个值,上下边距是200px,左右边距是100px

    (3)margin:200px 50px 100px;设三个值,上边距是200px,左右是50px,下边距是100px

    (4)margin:200px 50px 100px 50px;它是顺时针设置的,则上 右 下 左

    ◇空间的实际占用空间

    通过分析我们可以知道,一个元素实际占用的空间(区域)是:width+border*2+margin*2

    ◇一个标签元素的实际高度

    height+padding-top+padding-bottom+border*2

    ◇margin的塌陷现象是什么?

    相邻的两个块级元素都设置margin时,他们的外边距不会叠加,会取最大值,这种现象就叫做margin塌陷

    4、有的标签设置背景时会独占一行,还有的会根据内容的增减而改变自己的空间大小,则

    块级元素:p h1-h6 div ul ol dl li

    内联元素:span img i b a em icon

    二者的区别

    □块级元素

    (1)块级元素会独占一行

    (2)块级元素可以设置宽高

    □内敛元素

    (1)内敛不会独占一行

    (2)不可以设置宽高

    (3)内联元素的上下margin不起作用

    □二者转换

    块级元素转行级

    display:inline;

    行级转块级

    display:block;

    行级块元素(给需要的元素添加属性)

    display:inline-block;

    可以设置宽高,可以在一行,margin可以随便使用

    □lin-height(行高)可以设置字体的垂直位置

    line-height的值和height的值相同的时候,文本就是上下居中了

    □line-height的值

    line-height:50px/2;

    当为2时,line-height的值是2*font-size的大小

  • 相关阅读:
    idea 找不到包或找不到符号
    JOISC部分题解
    欧拉数学习笔记
    [清华集训2017]生成树计数
    [ZJOI2019]开关
    【题解】CF817E Choosing The Commander
    CSP-S 2020游记
    【学习笔记】线段树合并
    【题解】[IOI2005]Riv 河流
    【题解】哈希冲突
  • 原文地址:https://www.cnblogs.com/diwangkaige/p/9642918.html
Copyright © 2011-2022 走看看