zoukankan      html  css  js  c++  java
  • CSS小知识

    1.行高无单位

      line-height:2  此种写法表示行高为文字大小的两倍,即文字大小为16px,行高则为32px

    2.文字风格

      font-style:italic/oblique/normal

      共有三种属性值,italic:斜体字,oblique:倾斜的文字,normal:正常

      italic和oblique在视觉上效果一样

    3.首行缩进(text-indent)

      1.可以取负值

      2.只对第一行起作用  

    4.文字间距

      letter-spacing:控制字间距

      word-spacing:控制英文单词间距

    5.设置小型大写字母

      font-variant:small-caps

    6.CSS列表属性

      list-style-type:disc(实心圆)/circle(空圆)/square(方块)/none

      注意:可以使用图片

      list-style-image:url(图片路径)

    7.设置固定的背景图像(background-attachment)

      属性值有:scroll  默认值。背景图像会随着页面其余部分的滚动而移动。

           fixed 当页面的其余部分滚动时,背景图像不会移动。

           inherit 规定应该从父元素继承 background-attachment 属性的设置。

    8.float:none和clear:both的区别

      float:none是指当前元素无浮动,而clear:both是指清除浮动元素对当前元素的影响

      clear的属性值如下

        none :  允许两边都可以有浮动对象
        both :  不允许有浮动对象
        left :  不允许左边有浮动对象
        right :  不允许右边有浮动对象

    9.内联元素

      1.内联元素的margin和padding不影响元素的line-height

      2.内联元素的margin-left和margin可以正常使用,但是margin-top和margin-bottom不能正常使用

    10.盒模型

      1.margin和padding都可以写负值

    11.元素设置float相当于给元素添加了display:block属性

    12.基线对齐

      vertical-align对块元素是不起作用的

    13.padding-top , padding-bottom , margin-top , margin-bottom百分比问题

      当按百分比设定一个元素的宽度时,它是相对于父容器的宽度计算的,但是,对于一些表示竖向距离的属性,例如 padding-top , padding-bottom , margin-top , margin-bottom 等,当按百分比设定它们时,依据的也是父容器的宽度,而不是高度。

  • 相关阅读:
    深入浅出:了解前后端分离优势、前后端接口联调以及优化问题
    深入浅出:了解JavaScript中的call,apply,bind的差别
    Vue2.0 搭建Vue脚手架(vue-cli)
    深入浅出:promise的各种用法
    深入浅出:了解常见的设计模式(闭包、垃圾回收机制)
    sql server xml 功能
    sqlite 用法
    PowerDesigner使用
    asp.net 开发注意的几点
    vue template
  • 原文地址:https://www.cnblogs.com/suihang/p/11171470.html
Copyright © 2011-2022 走看看