SaberSama【css总结】
为什么要转过来呢?
因为我觉到,同样是一个初学者,应该互相学习,交流。
css:Cascading Style Sheets 层叠样式表
CSS引入方式:
1.内嵌: <p style="color:red;">xx</p>,这种方式使用最少,因为不方便阅读
2.内联:写在<head>中,<style>
p{xxxxx}
</style> 所有p元素都会执行{}中的代码。
3.外联:在外部创建一个CSS,再通过link连接这个css.也写在<head>中。
选择器:
1.ID选择器:命名一个 id="xx" 然后用#xx来提取。一段HTML中只能命名一个ID
2. class选择器:命名一个 class="xx" 然后用.xx来提取。可以命名多个class.
3.元素选择器:p{} span{} 元素{}
4.属性选择器:inpunt[type="text"]{}
伪类:
以一个<a>标签为例子。
a:link{xx} 没有被访问时的样式
a:visited{xx}访问后的样式
a:hover{xx}鼠标移上去的样式
a:active{xx}点击时的样式
伪元素:
:first-line{xx} 文字中的第一行的样式
:first-letter{xx}文字中的第一个字的样式
:before{xx}插入到选中的位置的最前面
:after{xx}插入到选中的位置的最后面
通配符:*,指所以元素。
后代:
ul li:nth-child(7) 指选中Ul中顺数第七个
ul li:nth-last-child(7) 指选中Ul中倒数第七个
ul li:nth-child(odd)指ul中的奇数列
ul li:nth-child(even)指ul中的偶列
ul li:nth-child(xn+y) 指xn+y的数字,n从0开始计算。
子级:
.p span{xxx} p下的所有span的样式
.p>span{xxx} 只改变子级。孙子级的不会被改变。
并集:
h1,h2,h3,h4,{xxxx} h1-h4的样式
div1.div2.div3{xxx} div1-div3的样式,多个样式的改变。
权重:important>style>id>class>元素>*
SaberSama【css总结】的更多相关文章
- Matplotlib数据可视化(3):文本与轴
在一幅图表中,文本.坐标轴和图像的是信息传递的核心,对着三者的设置是作图这最为关心的内容,在上一篇博客中虽然列举了一些设置方法,但没有进行深入介绍,本文以围绕如何对文本和坐标轴进行设置展开(对图像 ...
- CSS的未来
仅供参考 前言 完成<CSS核心技术与实战>这本书,已有一个多月了,而这篇文章原本是打算写在那本书里面的,但本章讲解的内容,毕竟属于CSS未来的范畴,而这一切都还不能够确定下来,所以这一章 ...
- 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧
记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...
- 前端css兼容性与易混淆的点
一.常用的骨灰级清除浮动 .clearfix:after { content: "."; display: block; height:; clear: both; visibil ...
- 理解CSS外边距margin
前面的话 margin是盒模型几个属性中一个非常特殊的属性.简单举几个例子:只有margin不显示当前元素背景,只有margin可以设置为负值,margin和宽高支持auto,以及margin具有 ...
- 理解CSS视觉格式化
前面的话 CSS视觉格式化这个词可能比较陌生,但说起盒模型可能就恍然大悟了.实际上,盒模型只是CSS视觉格式化的一部分.视觉格式化分为块级和行内两种处理方式.理解视觉格式化,可以确定得到的效果是应 ...
- 谈谈一些有趣的CSS题目(十二)-- 你该知道的字体 font-family
开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...
- ASP.NET MVC with Entity Framework and CSS一书翻译系列文章之第二章:利用模型类创建视图、控制器和数据库
在这一章中,我们将直接进入项目,并且为产品和分类添加一些基本的模型类.我们将在Entity Framework的代码优先模式下,利用这些模型类创建一个数据库.我们还将学习如何在代码中创建数据库上下文类 ...
- 谈谈一些有趣的CSS题目(十一)-- reset.css 知多少?
开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...
随机推荐
- 求范围内【l,r] , 内二进制的零比一多的数
#include<algorithm> #include<iostream> #include<cstring> #include<cstdlib> # ...
- 找到一篇关于 Oracle 全文检索实践 的文章
http://www.iteye.com/topic/1118055 有详细的例子记录了Oracle 全文检索的使用.
- iPhone10.3.X越狱后SSH连接不上的问题(已解决)
iPhone10.3.X越狱后SSH连接不上的问题 G0blin RC2,iPhone5s10.3.3 Jailbreak 最近研究了好几天,试了好多的方法. ssh 访问越狱iPhone的两种方式 ...
- python3 importlib模块简单利用
importlib作用:根据字符串形式导入模块,并且找到其中的类并执行 import importlib # m = importlib.import_module("src.plugins ...
- 可视化开发_AppInventor2似乎被抛弃了
工具 blockly google,mixly,scratch,app inventor2 的分别 可视化编程,青雀,来自 白鹭 没源码 如果想二次开发呢,初版拖拽控件生成,后期维护的时候找程序员加功 ...
- JS 获取get请求方式的参数
//获取页面中的参数 name值参数名称(例如:http://localhost:8099/index.aspx?id=10,name则指的是id)function GetQueryString ...
- 多线程编程_控制并发线程数的Semaphore
简介 Semaphore(信号量)是用来控制同时访问特定资源的线程数量,它通过协调各个线程,以保证合理的使用公共资源.很多年以来,我都觉得从字面上很难理解Semaphore所表达的含义,只能把它比作是 ...
- Unable to instantiate receiver xxx.receiver.NetworkReceiver异常
Unable to instantiate xxxreceiver.NetworkReceiver: 这个异常是之前版本有NetworkReceiver(监听网络变化的),新的版本删除了Network ...
- Python操作列表
1.List Python内置的一种数据类型是列表:list.list是一种有序的集合,可以随时添加和删除其中的元素. 比如,列出班里所有同学的名字,就可以用一个list表示: >>> ...
- javascript 例外处理Try{}catch(e){}
程序开发中,编程人员经常要面对的是如何编写代码来响应错误事件的发生,即例外处理(exception handlers).如果例外处理代码设计得周全,那么最终呈现给用户的就将是一个友好的界面.否则,就会 ...