• 9.13日笔记


    1.面试题

    为什么会出现不同的效果?

    浏览器在解析第二p的时候,因为字母之间没有空格,他认为是一个单词没有写完,所以不会换行。

    列表的分类

    1.无序列表 ul

    内部必须有字标签<li></li>

    ul天生自带内外边距,还有一个p标签

    并集选择器的好处和弊端

    好处: 因为省事

    弊端:就是因为太省事,增加了浏览器的负荷。

    解决办法:按需选择

    list-style这个是样式属性

    list-style的属性值:circle(空心圆)disc(实心圆)square(正方形)none(空)

    ol 有序列表

    内部标签必须有子标签<li>

    天生自带内外边距

    ol和ul的不同之处在于前面符号的区别

    用标签属性tapy修改

    自定义列表

    DI是自定义列表  dt是小标题 dd是内容

    列表可以做二级菜单和导航

    备注

    Marginpadding问题的探讨

    Margin:200px;设置一个值 说明top right bottom left 都是200px

    Margin200px 100p;设置两个值 上下是200px  左右是100px

    Margin200px 50px 100px 上是200px 左右是50px  下是100px

    Margin:200px 50px 100px 50px; 上是200  右是50px 下是100px 左是50px

    Padding同上

    实际占用的空间大小

    通过分析我们发现 一个元素实际占用的空间是

    Width+border*2+padding*2+margin*2

    一个标签元素的实际高度是=height+padding-top+padding-bottom+2*border

    margin的塌陷是什么

    相邻两个元素同时设置margin时,他们之间的外边距不会叠加,会取最大的,这种现象就叫塌陷现象。

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

    根据以上现象,标签有分为

    块级标签:<p/h1-h6/div/ul/il/ol/dl>

    内敛标签(也可以叫行级标签):<span/img/i/b/a/em/icom(矢量图)>

    两者的区别

    块级元素:1.会独占一行 2.可以设置宽高

    内敛元素:根据内容改变空间大小,不能设置高宽,margin上下无作用

    二者的转换

    块级转行级

    给块级元素添加属性:display:inline; display显示line"行"

    行级转块级:给行级元素添加属性:display:block;...block块

    行级快元素:给需要的元素添加属性:display:inline-block
    (可以设置宽高了,可以在一行了,margin可以随便使用)

    备注
    line-height:行高  设置字体的垂直位置
    line-height 的值和height的值相同,文本就上下居中
    拓展  line-height:50px/2
    当是2的时候line  height的值是2*font size的大小====36px

  • 相关阅读:
    C#中虚方法与抽象方法的区别
    关于计算同一个用户购买日期间隔查询语句
    pandas 讲数据分组之后保留前N行方法
    关于Mysql隐式转化及注意事项与cast函数运用
    Mysql 去重
    记一个pandas 分组之后.head()返回的数据问题
    Failed to introspect Class xxxx
    golang 推荐学习记录
    Java内存区域
    Struts2中采用Json返回List对象数据为空解决方案
  • 原文地址:https://www.cnblogs.com/zhaoxinru/p/9642559.html
Copyright © 2020-2023  润新知