189 8069 5689

CSS选择器和常用样式有哪些

本篇内容主要讲解“CSS选择器和常用样式有哪些”，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习“CSS选择器和常用样式有哪些”吧!

让客户满意是我们工作的目标，不断超越客户的期望值来自于我们对这个行业的热爱。我们立志把好的技术通过有效、简单的方式提供给客户，将通过不懈努力成为客户在信息化领域值得信任、有价值的长期合作伙伴，公司提供的服务项目有：域名注册、虚拟主机、营销软件、网站建设、云浮网站维护、网站推广。

CSS的基本使用

  • 直接写在标签内

段落

  • 写在 style 标签内

  • 使用外部 .css 文件

    • link

    • @import （不建议使用此方式）

CSS选择器

  • 优先级：id选择器 > class 选择器 > 标签选择器

  • 标签选择器：标签名{}

  • class选择器（“.”符号）：.class名{}

  • id选择器（“#”符号，id 选择器唯一）：#id名{}

  • 群组 选择器（“，”逗号分开）：

    • 群组选择器可以同时选择多个标签

    • p,div{...}

  • 层次选择器

    • 子代 （符号“>”）：div>p{...}

    • 后代 (空格)：div p {...}

    • 相邻 （符号“+”）：#p_id~span {...}

    • 兄弟 （符号“~”）：#p_id~p {...}

  • 伪类选择器（符号“:”）

    • a:active {...}

    • a:hover {...}

    • a:visited {...}

    • a:link {...}

    • link：未访问过的样式

    • visited：访问过后的样式

    • hover：划过的样式

    • active：激活的样式

字体

  • 字体：font-family

  • 字体大小：font-size

  • 字体样式：font-style

  • 字体粗细：font-weight

  • 字体小大写：font-variant (将小写字母改为小型字体的大写字母)

  • 复合样式：font (默认顺序：style variant weight size/height family)
     

文本

  • 对齐方式：text-align

  • 首行缩进：text-indent

  • 文本线：text-decoration

  • 字距：letter-spacing

  • 词距：word-spacing

  • 行高：line-height
     

背景

  • 背景颜色：background-color

  • 背景图片：background-image

  • 背景铺盖：background-repeat

  • 背景大小：background-size

  • 背景定位：background-position

  • 复合样式：background

    • backgroud：red url(" ") no-repeat center;
       

常用样式

1. font-family:字体，eg: Microsoft-Yahei
2. font-size/color:字号/颜色
3. font-weight:bold 粗体
4. font-style:italic 斜体
5. text-decoration:underline 下划线
6. text-decoration:line-through 删除线
7. text-indent:2em 缩进文字的2倍大小
8. line-height:1.5em 行间距: 1.5倍文字大小
9. letter-spacing:50px 字间距，字母间距
10.word-spacing:50px 单词与单词间距
11.text-align:center/left/right 居中/居左/居右
12.color：rgb(255,255,255); 参数是0-255的数，可自调颜色
13.backgroud-image:url("1.png"); 背景图
14.backgroud-repeat:repeat-y/repeat-x/no-repeat; 图片按列/行/角排
15.backgroud-position:right center/center center; 图片位置靠右居中
16.以上可缩写为: backgroud: red url("1.png") no-repeat center;
17.border:solid 1px red;边框属性
18.ul, ol{list-style: 。。。。}列表属性
19.display:block/inline/none; 内联和块级切换/隐藏

到此，相信大家对“CSS选择器和常用样式有哪些”有了更深的了解，不妨来实际操作一番吧！这里是创新互联网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！


当前标题：CSS选择器和常用样式有哪些
新闻来源：http://cdxtjz.cn/article/igiejs.html

其他资讯