下载贤集网APP入驻自媒体
CSS 指层叠样式表 (Cascading Style Sheets)
CSS (Cascading Style Sheets) 用于渲染HTML元素标签的样式
样式定义如何显示 HTML 元素
样式通常存储在样式表中
把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问题
外部样式表可以极大提高工作效率
外部样式表通常存储在 CSS 文件中
多个样式定义可层叠为一
:
如果你要在HTML元素中设置CSS样式,你需要在元素中设置"id" 和 "class"选择器
id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。
http:/ /www.ceasm.com/renshenggeyan/
HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 "#" 来定义
class 选择器用于描述一组元素的样式,class 选择器有别于id选择器,class可以在多个元素中使用。
class 选择器在HTML中以class属性表示, 在 CSS 中,类选择器以一个点"."号显示:
类名的第一个字符不能使用数字!它无法在 Mozilla 或 Firefox 中起作用
选择器通常是您需要改变样式的 HTML 元素。
每条声明由一个属性和一个值组成。
属性(property)是您希望设置的样式属性(style attribute)。每个属性有一个值。属性和值被冒号分开
:
css样式三种调用使用方式:
插入样式表的方法有三种:
外部样式表(External style sheet):语法:<link rel="stylesheet" type="text/css" href="mystyle.css">
内部样式表(Internal style sheet):在头部写样式
内联样式(Inline style):直接在元素中写(不推荐)
*全局标记{ }
:
为了避免Internet Explorer 中无法调整文本的问题,使用 em 单位代替像素。
em的尺寸单位由W3C建议。
1em和当前字体大小相等。在浏览器中默认的文字大小是16px。
因此,1em的默认大小是16px,可以换算。
:
css背景样式:
background-color:背景颜色
background-image:url("图片"):背景图片(默认情况下,背景图像进行平铺重复显示,以覆盖整个元素实体)
background-repeat:背景平铺 on-repeat不平铺 -x横向平铺-y垂直平铺
background-position:背景定位属性
background-attachment:背景附件属性 fixed(固定背景属性)
background:# url(#)有背景有图片输入 列子
:
css文本样式值:
:#px; 文字大小
:字体样式,如:微软雅黑
font-style:文字状态如 斜体等
font-weight:文字粗细
text-align:文本对齐
font-variant :字体之间的转变,以小型大写字体或者正常字体显示文本。
line-height:行高 上下距离会有变化,也可以用于行与行之间的空间(%)
text-decoration:文本装饰 underline下划线 none去除下划线
text-decoration: overline:上划线
text-decoration:line-through:删除线
text-transform: uppercase:英文大写
text-transform:lowercase:英文小写
text-transform:capitalize:首字母大写
text-align:设置为"justify",每一行被展开为宽度相等,左,右外边距是对齐
text-indent:第一行的文本缩进
text-shadow:文本阴影,(1.左右2.上下3.模糊程度4.颜色)
letter-spacing:字符之间的空间
direction:文字方向
word-spacing:增加在字符之间空白的空间
white-space:nowrap:在元素内禁止文字环绕
字体属性定义字体,加粗,大小,文字样式。
属性设置文本的字体系列。
属性应该设置几个字体名称作为一种"后备"机制,如果浏览器不支持第一种字体,他将尝试下一种字体。
font-style:这个属性有三个值:normal(正常),italic(斜体),oblique(斜体)
属性设置文本的大小。
能否管理文字的大小,在网页设计中是非常重要的。但是,你不能通过调整字体大小使段落看上去像标题,或者使标题看上去像段落。
请务必使用正确的HTML标签,就<h1> - <h6>表示标题和<p>表示段落:
字体大小的值可以是绝对或相对的大小。
绝对大小:设置一个指定大小的文本,不允许用户在所有浏览器中改变文本大小
确定了输出的物理尺寸时绝对大小很有用
相对大小:相对于周围的元素来设置大小,允许用户在浏览器中改变文字大小
: