css基本选择器有哪些

发布时间:2022-03-14 10:01:24 作者:小新
来源:亿速云 阅读:193

这篇文章主要为大家展示了“css基本选择器有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“css基本选择器有哪些”这篇文章吧。

  CSS基本选择器(对指定的标签设置样式,要把指定的标签选择出来):元素选择器、类选择器、id选择器、组合选择器、通用选择器

  1. 元素选择器(类型选择器或标记选择器):声明哪些元素采用css样式

  2. 类选择器(class):应用样式而不考虑具体设计的元素,为了将类选择器的样式与元素进行关联,必须将元素中的class属性指定一个适当的值。

  class 选择器在HTML中以class属性表示, 在 CSS 中,类选择器以一个点"."号显示。也可以指定特定的HTML元素使用class。

  在HTML中,一个class属性还可能包含多个属性值,各个值之间用空格分隔,表示将多类应用到同一个标记中。可以使用多次,表示类别。

  Document

  p.special{

  color: red;

  }

  3. id选择器(id):

  id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。

  HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 "#" 来定义。

  不同与类选择器,id选择器不能组合使用,不容许有空格分隔的多个值,仅仅使用一次。

  #red {color:red;}

  这个段落是红色。

  4.组合选择器:

  多个选择器(元素选择器、类选择器、id选择器等)通过逗号连接。

  样式一样的可以进行组合。

  html5语义化

  header, section, footer, aside, nav, article, figure

  {

  display: block;

  }

  nav,header,p,article{

  width: 1200px;

  margin:0 auto;

  }

  ul{

  height:40px;

  background-color: #fff;

  list-style: none;

  display: inline-block;

  width: 1200px;

  padding: 0px;

  }

  li{

  line-height: 40px;

  text-align: center;

  float: left;

  width: 400px;

  margin:0 auto;

  }

  li:hover{

  background: pink;

  }

  a{

  text-decoration: none;

  }

  。post{

  border:1px dashed #000;

  padding: 0 0 20px 20px;

  margin-bottom: 40px;

  padding-top: 10px;

  background-color: #fff;

  }

  #content{

  border:1px solid #ccc;

  padding:30px 40px;

  background-color: rgb(247,244,255);

  margin-top: 20px;

  }

  页面导航

  查看相关内容返回首页返回本页

  作者,初级码农

  培训的,大概培训了半年,js、jquery、bootstrap、angular、vue、Ajax、数据库、php、面向对象、Web服务器、移动端

  我觉得还行

  作者:Amy

  工作机会还多的,php是轻量级网站开发最好的选择

  不错了

  作者:键盘侠

  学历本科、信息专业、会这么多,不会找不到的,对自己有信心一点

  我的帖子我做主

  关于楼主

  用户组:菜鸟初级

  阅读量:20

  发表时间:2020-03-18

  my logo

  5.?通用选择器:?星号(*)

  该选择器可以与任何元素进行匹配,可以对文档中的所有元素设定属性和属性值。

  div布局

  *{margin: 0;

  padding: 0;

  border: 0;

  }

  #header{

  width: 100%;

  height: 80px;

  line-height: 80px;

  background-color: rgb(255,165,0);

  }

  #main{

  height:200px;

  }

  #menu{

  float: left;

  height:200px;

  width: 10%;

  background-color: yellow;

  }

  menu{

  height: 200px;

  }

  b{

  display: inline-block;

  margin-top: 10px;

  font-size: 18px;

  margin-left: 5px;

  }

  ul{

  margin-left: 46px;

  list-style: none;

  margin-top: 10px;

  }

  ul li{

  line-height: 40px;

  }

  #content{

  float: left;

  height:200px;

  background-color: pink;

  width: 90%;

  }

  #content p{

  text-align: center;

  line-height: 200px;

  }

  #footer{

  background-color: gray;

  height:80px;

  line-height: 80px;

  text-align: center;

  }

以上是“css基本选择器有哪些”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注亿速云行业资讯频道!

推荐阅读:
  1. 有哪些css高级选择器
  2. CSS中选择器有哪些

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

css

上一篇:HTML中引入CSS的方式有哪些

下一篇:家政服务小程序开发怎么优化用户体验

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》