CSS期末复习速览(一)

1.标签选择器,格式:标签{ ...... },例如div{ color:pink; },代表全部div中的字都是pink色

2.类选择器,格式:.类名{......},通过class="类名"调用,例如.red{color:red;},

<li class="red">呵呵<li>

3.类选择器中可以调用多类名,类名之间用空格隔开就行,例如<div class="box red">红色的盒子</div>

4.id选择器,格式:#名称,通过id="名称"调用,例如#pink{color:pink;} ,<div id="pink">爱</div>,其中id选择器只能调用一次,再调用就没有效果了

5.通配符选择器,格式:*{......},代表全部标签初始化都是这样的,常用来清除所有的元素标签的内外边距*{margin:0;padding:0;}

6.font-family用来定义字体系列,常用微软雅黑

7.font-size用来定义字号大小,后面跟px值

8.font-weight用来设置文本字体的粗细,有三种选择:normal(不加粗),bold(加粗),100-900(400等同normal,700等同bold,数字后面不跟单位),主要用途:让标题标签不加粗

9.font-style用来设置字体样式(斜体或正常),normal(正常),italic(斜体)

10.color用来定义文本颜色,三种方式:预定义颜色值,如red,blue;十六进制,如#FF0000;RGB代码,如rgb(255,0,0)或rgb(100%,0%,0%)

11.text-align用来设置文本对齐,三种选择:left(左对齐,默认),right(右对齐),center(居中对齐)

12.text-decoration用来设置文本样式,四种选择:none(没有装饰线),underline(下划线),overline(上划线),line-through(删除线),主要用途:通过none让链接的下划线消失

13.text-indent用来设置文本缩进,px/em,em表示当前文字的大小

14.line-height设置行间距,行间距由三部分组成:上间距,文本高度,下间距,例如行间距为26px,如果文本大小为16px,那么上下间距为(26-16)/2=5px,主要用途:让行间距等于盒子的高度,实现文字在当前盒子内垂直居中

15.后代选择器,格式:父标签 子标签{......},代表选择父标签底下所有的子标签

16.子元素选择器,格式:父元素>子元素{......},代表选择父元素最近一级的子元素(只选亲儿子,孙子和重孙子都不管)

17.并集选择器,格式:标签1,标签2......{......},代表选择多个标签

18.链接伪类选择器,四种:a:link(选择所有未被访问的链接),a:visited(选择所有已经被访问过的链接),a:hover(选择鼠标指针位于其上的链接),a:active(选择鼠标按下未弹起的链接)

19.focus伪类选择器(用于表单),格式:input:focus{......},把获得光标的input表单元素选择出来

20.如果使用外部样式表,则需要将.css文件引用到.html文件,方法是<link rel="stylesheet" href="css文件路径">

相关推荐
突然暴富的我7 分钟前
html三级菜单
前端·html
性野喜悲38 分钟前
vue通过后台返回的数字显示不同的文字内容,多个内容用、隔开
前端·javascript·vue.js
武汉前端开发蓝风1 小时前
前端Debugger时复制的JS对象字符转JSON对象
前端·javascript·json·debugger
爱编程的鱼1 小时前
HTML如何在图片上添加文字
前端·javascript·html
顶顶年华正版软件官方1 小时前
关键帧功能怎么使用 关键帧控制视频特效怎么用 会声会影视频剪辑软件教程
前端·javascript·音视频·学习方法·关键帧·会声会影教程·视频剪辑软件
来之梦2 小时前
uniapp自定义富文本现实组件(支持查看和收起)
前端·javascript·uni-app
森叶2 小时前
Electron开发 - 如何在主进程Main中让node-fetch使用系统代理
前端·javascript·electron
睿麒2 小时前
前端八股文 说一说样式优先级的规则是什么?
前端
小妖怪的夏天2 小时前
Electron Forge 打包更改打包后图片
前端·javascript·electron
吕彬-前端2 小时前
es6之Proxy实现观察者模式
前端·观察者模式·es6