class同一个类名可以应用于页面上任意多个元素,因此类的功能强大的多。类非常适合表示内容的类型或其他相似的条目。
在实际开发中,要根据实际使用情况来决定是使用哪种样式。对于单一元素的在单一界面的展示样式可以推荐是用id来定位。多余多个界面公用,或者同一界面多个元素风格一致,样式统一使用class类要方便的多。
下面就是最简单的一个小例子:
展示效果:
@ css新元素是选择器还是别的?
css中的所有元素都是选择器,不论新元素还是旧元素,都是对标签的选择。@ css包含元素?
css元素分为三种:块级元素、行内元素和行内块元素
1、 块级元素
设置display:block就是将元素显示为块级元素
常用的块状元素有:
<div>、<p>、<h1>…<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>
特点:
独占一行
高度,行高、外边距以及内边距都可以控制
宽度默认是容器的100%
以容纳内联元素和其他块元素
2、 行内元素
块级元素也可以通过代码display:inline将元素设置为行内元素
常用的行内元素有:
<a>、<span>、
、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code>
特点:
多个元素在同一行
高、宽无效,但水平方向的padding和margin可以设置,垂直方向的无效
默认宽度就是它本身内容的宽度
行内元素只能容纳文本或则其他行内元素。(a特殊)
可以通过设置display属性变成其他元素
注意:
只有 文字才 能组成段落 因此 p 里面不能放块级元素,同理还有这些标签h1,h2,h3,h4,h5,h6,dt,他们都是文字类块级标签,里面不能放其他块级元素。链接里面不能再放链接。
3、 行内块状元素
行内块元素(display:inline-block)就是同时具备行内元素、块状元素的特点,代码display:inline-block就是将元素设置为状元素
@ 元素选择器的权值规则是哪些?
1. 内联样式表的权值最高 1000 2. ID 选择器的权值为 100 3. Class 类选择器的权值为 10 4. HTML 标签选择器的权值为 1 CSS 优先级法则: A 选择器都有一个权值,权值越大越优先 B 当权值相等时,后出现的样式表设置要优于先出现的样式表设置 C 创作者的规则高于浏览者:即网页编写者设置的CSS 样式的优先权高于浏览器所设置的样式 D 继承的CSS 样式不如后来指定的CSS 样式 E 在同一组属性设置中标有“!important”规则的优先级最大 这是规定好的,自然不能打破
通用兄弟元素选择器是css选择器吗 CSS的类选择器和id选择器各有什么优势 – CSS – 前端 css3 鼠标经过动画