CSS知识点总结(css知识点思维导图)

yumo6669小时前技术文章1

CSS(cascading style sheet)层叠样式表语言,用来专门修饰HTML的。有三种方式将CSS嵌入html中。

第一种:

内联定义。任何一个html标签都可以指定style属性,在标签的style属性上直接定义样式名和值,语法如下:

<标签 style=“样式名:样式值;

样式名:样式值;

样式名:样式值;”>

</标签>

样式名可以为字体,文本,背景,定位,尺寸,布局,表格,列表,边框

第二种:

在head标签中使用style标签,定义内部样式块对象。语法如下:

<style type=”text/css”>

选择器 {

样式名:样式值;

样式名:样式值;

样式名:样式值;

….

}

</style>

常用的三种选择器为:标签选择器(直接写),id选择器(id名字前面加上#)和class选择器(任何一个标签都有class属性,class值相同的,可以看作是同一类标签,class名字前面加上一个点.)。

第三种:

利用link标签,链入外部样式表文件。语法如下:

<link href="{%static "css/adstyle.css" %}" rel="stylesheet" type="text/css" />

优先级:id选择器>类选择器>标签选择器

CSS常见的样式:

隐藏:display:none;

文本装饰:text-decoration:underline;

列表样式:list-style-type:none;

设置鼠标悬停效果:span:hover;

内外补丁:margin-top:10px padding-left:20px;

悬浮样式:float:left;

光标样式:position:absolute; cursor:pointer;

相关文章

浅谈position中absolute和relative

CSS position属性中absolute和relative很容易让人弄混,基本的概念什么着,你去参考W3C,就不啰嗦了--------------------------------------...

CSS box-sizing 属性详解(css中box属性有哪些)

box-sizing 是 CSS 的一个非常重要的属性。CSS 的 box-sizing 属性用于控制元素尺寸的计算方式,决定了元素的宽度( width )和高度( height )是否包含内边距(...

探索CSS position属性(css的position的属性有哪些)

提示:点击上方"蓝色字体"↑ 可以订阅噢!摘要 51RGB官方微信position是CSS中非常重要的一个属性,通过position属性,我们可以让元素相对于其正常位置,父元素或者浏览器窗口进行偏移。...

为什么有些事情用CSS就够了(css为什么不能用百分比)

JavaScript确实强大,这是毋庸置疑的。 但你知道吗?其实不一定每次都需要它。 事实上,JavaScript越少,网站性能往往越好。 为什么要减少JavaScript的使用? 想象你背...

简单了解CSS3的all属性(css3 selector)

作者:张鑫旭(@张鑫旭)网址:http://www.zhangxinxu.com/wordpress/2016/03/know-about-css3-all/一、兼容性一些CSS文章,或者CSS文档,...

CSS实现常见元素水平、垂直居中(css中元素水平居中显示的方法?)

CSS实现常见元素水平、垂直居中(css中元素水平居中显示的方法?)

本文简单介绍如何通过CSS实现常见元素的水平、垂直居中。水平居中行内元素这种情况最简单,只需要将行内元素包括在一个display属性为block的父元素中,并且设置父元素text-align为居中即可...