css 常见问题总结

css 常见问题总结

哪些css属性可以继承?

  • 可继承:

    1. font-size
    2. font-family
    3. color
    4. ul
    5. li
    6. dl
    7. dd
    8. dt
  • 不可继承:

    1. border
    2. padding
    3. margin
    4. width
    5. height

css 有哪些选择器,优先级如何计算

  • id 选择器 (# myid)
  • 类选择器 (.myclass)
  • 标签选择器 (div)
  • 相邻选择器 (h1+p)
  • 子代选择器 (div>p)
  • 后代选择器 (div p)
  • 通配符选择器 (*)
  • 属性选择器 (div[class=”myclass”])
  • 伪类选择器 (a:hover, li:nth-child)

css3 新增选择器

  • p:first-of-type
  • p:last-of-type
  • p:only-of-type
  • p:only-child
  • nth-child(2)
  • :enabled
  • :disabled
  • :checked

优先级: !important > 内联 > id > class > tag

优先级就近原则,样式定义最近者为准 内联 > 嵌入 > link引入

以最后载入的样式为准

行内元素块元素分别有哪些

  • 行内元素

    1. a - 锚点
    2. abbr - 缩写
    3. acronym - 首字
    4. b - 粗体(不推荐)
    5. bdo - bidi override
    6. big - 大字体
    7. br - 换行
    8. cite - 引用
    9. code - 计算机代码(在引用源码的时候需要)
    10. dfn - 定义字段
    11. em - 强调
    12. font - 字体设定(不推荐)
    13. i - 斜体
    14. img - 图片
    15. input - 输入框
    16. kbd - 定义键盘文本
    17. label - 表格标签
    18. q - 短引用
    19. s - 中划线(不推荐)
    20. samp - 定义范例计算机代码
    21. select - 项目选择
    22. small - 小字体文本
    23. span - 常用内联容器,定义文本内区块
    24. strike - 中划线
    25. strong - 粗体强调
    26. sub - 下标
    27. sup - 上标
    28. textarea - 多行文本输入框
    29. tt - 电传文本
    30. u - 下划线
    31. var - 定义变量
  • 块元素

    1. address - 地址
    2. blockquote - 块引用
    3. center - 举中对齐块
    4. dir - 目录列表
    5. div - 常用块级容易,也是
    6. css layout的主要标签
    7. dl - 定义列表
    8. fieldset - form控制组
    9. form - 交互表单
    10. h1 - 大标题
    11. h2 - 副标题
    12. h3 - 3级标题
    13. h4 - 4级标题
    14. h5 - 5级标题
    15. h6 - 6级标题
    16. hr - 水平分隔线
    17. isindex - input prompt
    18. menu - 菜单列表
    19. noframes - frames可选内容,(对于不支持frame的浏览器显示此区块内容
    20. noscript - 可选脚本内容(对于不支持script的浏览器显示此内容)
    21. ol - 排序表单
    22. p - 段落
    23. pre - 格式化文本
    24. table - 表格
    25. ul - 非排序列表

DIV CSS两种盒子模型

  • 定义:

网页设计中常听的属性名:内容(content)、填充(padding)、边框(border)、边界(margin), CSS盒子模式都具备这些属性。
这些属性我们可以用日常生活中的常见事物——盒子作一个比喻来理解,所以叫它盒子模式。
CSS盒子模型就是在网页设计中经常用到的CSS技术所使用的一种思维模型。

  • 标准盒子模型/W3C盒子模型 - content-box

范围包括margin,border,padding,content 并且content不包含其他部分

  • IE盒子模型 - bordr-box

范围包括margin,border,paddin,content 和W3C盒子模型不同的是它的content包含了border和padding

content-box和border-box的主要区别是二者的盒子的宽度是否包含元素的边框和内边距。
赞 赏
微信扫一扫