CSS——id 和 class 选择器
2017-03-18 21:10
435 查看
id 选择器
HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 “#” 来定义。ID属性不要以数字开头,数字开头的ID在 Mozilla/Firefox 浏览器中不起作用。代码实例:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>再见二逼K</title> <style> #para1 { text-align:center; color:red; } </style> </head> <body> <p id="para1">Hello World!</p> <p>这个段落不受该样式的影响。</p> </body> </html>
结果:
text-align注:
left 把文本排列到左边。默认值:由浏览器决定。
right 把文本排列到右边。
center 把文本排列到中间。
justify 实现两端对齐文本效果。
inherit 规定应该从父元素继承 text-align 属性的值。
class 选择器
class 选择器用于描述一组元素的样式,class 选择器有别于id选择器,class可以在多个元素中使用。class 选择器在HTML中以class属性表示, 在 CSS 中,类选择器以一个点”.”号显示
代码示例1:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>再见二逼K</title> <style> .center { text-align:center; } </style> </head> <body> <h1 class="center">标题居中</h1> <p class="center">段落居中。</p> </body> </html>
代码示例2:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>再见二逼K</title> <style> p.center { text-align:center; } </style> </head> <body> <h1 class="center">这个标题不受影响</h1> <p class="center">这个段落居中对齐。</p> </body> </html>
相关文章推荐
- css中.class和id选择器的异同点
- css中id选择器和class选择器的区别?
- CSS id 和 class 选择器
- [HTML] CSS Id 和 Class选择器
- CSS中id和class选择器注意点
- CSS的Class以及ID选择器
- css中id选择器和class选择器的区别?
- CSS中的id选择器和class选择器简单介绍
- css学习之id和class选择器
- 10006---CSS id 和 class 选择器
- CSS id/class选择器以id/class和CSS属性选择器以为属性作为筛选条件在格式上的介绍
- web前端-CSS id和Class选择器-002
- css中id选择器和class选择器的区别?
- css 当用id选择器与 class 选择器选择同一目标但是应用不同修饰时的选择问题
- css基本选择器,id选择器,class选择器,标签选择器,*通配符选择器,逗号 空格 + >
- css中的ID选择器和CLASS选择器的区别
- css中选择器何时使用id/class
- CSS-id选择器与class选择器的区别
- CSS ID选择器与CLASS选择器
- CSS ID选择器与CLASS选择器