css选择器

css选择器

标签(空格分隔): 三种


  • id选择器

    • 匹配到唯一的id
  • class选择器

    • 可以复用
  • 标签选择器

    • div p ul li
  • 组合选择器

  • E,F既匹配元素E又匹配元素F

  • E F匹配元素E后面的包含元素F的样式

  • E>F匹配E元素的直接子元素

  • 伪类选择器

    • a:active鼠标点击不释放
    • a:link
    • a:hover 鼠标移入时的效果
    • a:visited
  • box-sizing: border-box;盒模型,盒子里的padding值不会影响到盒子宽度和高度

  • 在查看兼容性的时候,百度搜索can i use

样式三种方式引入

  • 外链式 <link rel="stylesheet" type="text/css" href="css/style.css">
  • 内联样式<style type="text/css"></style>
  • 内部样式style="width: 120px; height: 120px;"

markdown链接写法
百度

块级标签:

 div p ul li h1-h6 dl dt dd

行内标签:

a span img input em strong 

嵌套规则:
块级标签可以嵌套行内标签,但是行内标签不能嵌套块级标签
p里面可以嵌套a span

display:inline-block; 行内转化为块级元素
display:inline; 把块级转化为行内

如果想让一块显示,另一块隐藏.
display:block; //显示
display:none; //隐藏

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一、CSS选择器常见的有几种? 1. 基础选择器 *:通用元素选择器,匹配页面任何元素 id选择器:选择指定id...
    小木子2016阅读 3,110评论 0 0
  • CSS选择器常见的有几种? 基础选择器 “*” -> 通用元素选择器,匹配页面任何元素。很少使用 “#” -> i...
    饥人谷_吴亚敏阅读 2,286评论 0 0
  • 1.class 和 id 的使用场景? class:类选择器,一个标签可以有多个类且同一个类可以用到不同的标签上,...
    饥人谷_兔子君阅读 4,933评论 0 0
  • 1.class 和 id 的使用场景? 类选择器允许以一种独立于文档元素的方式来指定样式。该选择器可以单独使用,也...
    草鞋弟阅读 7,162评论 0 1
  • class 和 id 的使用场景 class:一个标签可以有多个class且同一个class可以用到不同的标签上,...
    尾巴尾巴尾巴阅读 3,118评论 0 0