css(一)

原创 2015年11月17日 18:46:55
  1. 一般css放在head中
  2. 注释:在CSS中也有注释语句:用/*注释语句*/来标明(Html中使用<!--注释语句-->)
  3. 三种样式
    内联式<p style="color:red">这里文字是红色。</p>
    嵌入式
    <style type="text/css">
    span{
    color:red;
    }
    </style>

    外部式<link href="base.css" rel="stylesheet" type="text/css" />
    优先级:内联式 > 嵌入式 > 外部式
  4. 选择器
    1. 标签选择器 p{font-size:12px;line-height:1.6em;}
    2. 类选择器 .类选器名称{css样式代码;}
    3. id选择器 #id{}
      注:类选择器和id选择器的区别:(1)id选择器在一个html中只能使用一次(2)类选择器可以设置样式列表,即<span class="stress bigsize">,但是id选择器不可以
    4. 子选择器,.food>li{border:1px solid red;},只有第一代的所有子标签
    5. 包含(后代)选择器.first span{color:red;},所有代后代
    6. 通用选择器 * {color:red;},所有标签
    7. 伪选择器 a:hover{color:red;} 当鼠标略过的时候,出现格式,可以加载所有的标签中
    8. 分组选择器 .first,#second span{color:green;}
  5. 继承
    表示包含的子标签继承父标签的样式,color具有继承性,border似乎不具有继承性
  6. 权值
    在样式冲突的时候,根据权值进行选择。
    p{color:red;}
    .first{color:green;}
    <p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩。</p>

    标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100
  7. 层叠
    p{color:red;}
    p{color:green;}
    <p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩。</p>

    按照就近原则
  8. important的样式优先级最高
    p{color:red!important;}
    p{color:green;}
    <p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩。</p>
  9. 文字排版
    字体 font-family:”宋体”;
    字号 font-size:12px;
    颜色 color:#666;
    粗体 font-weight:bold;
    斜体 font-style:italic;
    下划线 text-decoration:underline;
    删除线 text-decoration:line-through;
    缩进 text-indent:2em;//2em意思是文字的两倍大小
    行间距 line-height:1.5em;
    中文字、字母间距 letter-spacing:50px;
    单词间距 word-spacing:50px;
    块状元素内文字图片对齐方式 text-align:center;
版权声明:如果文中有任何问题或者值得讨论的地方,都可以在下方留言或者QQ526664687,欢迎交流!!!

CSS中滚动效果<MARQUEE>的用法

%{sta.index+1}、 %{tableTr.get('title')}     
  • xiaokangmiclong
  • xiaokangmiclong
  • 2015年11月30日 16:28
  • 1604

纯CSS实现小三角提示信息

纯CSS实现小三角提示信息
  • GISShiXiSheng
  • GISShiXiSheng
  • 2014年12月03日 13:57
  • 4700

css定位“十字架“之水平垂直居中

1.先看要实现的效果实际的效果图可以看到我的实现过程是先使用一个父级的div来定位水平垂直居中,然后再父级的div中定位出两个十字架的div。看实现代码: ...
  • yisuowushinian
  • yisuowushinian
  • 2015年05月18日 22:00
  • 4199

CSS三大特性之继承性

CSS有三大特性,分别是继承性,层叠性,优先级,这里讲解继承性 继承性是指子元素可以继承父元素的属性,例如下面的代码,div中包含2个p标签,1一个span标签,当给div设置字体颜色为红色时,他的子...
  • k491022087
  • k491022087
  • 2016年08月25日 23:50
  • 6830

HTML调用CSS的四种方法

前言:因工作使用到以前未曾接触的CSS,但是在调用CSS的过程中遇到一个大问题: ``无法加载的问题。(只知道是无效的方法,具体原因不解,求解)这篇博客详细地列举了4种HTML导入的方式,前面2种方式...
  • tomorrowsunny
  • tomorrowsunny
  • 2015年09月30日 18:40
  • 6762

CSS最详细的基础教程

层叠样式表CSS 绝对原创 CSS简介:Cascading Style Sheets(层叠样式表)的缩写,它是一种用来表现HTML或XML等文件样式的计算机语言。 CSS的作用: 是定义网页外...
  • wulove52
  • wulove52
  • 2016年08月30日 20:54
  • 2001

css模块化及CSS Modules使用详解

什么是css模块化?为了理解css模块化思想,我们首先了解下,什么是模块化,在百度百科上的解释是,在系统的结构中,模块是可组合、分解和更换的单元。模块化是一种处理复杂系统分解成为更好的可管理模块的方式...
  • xiangzhihong8
  • xiangzhihong8
  • 2016年11月17日 09:46
  • 6347

CSS tab选项卡(标签页)切换

在github上看到一篇 You dot need JavaScript 很多效果不需要js也能做到,比如手风琴的效果,轮播,弹出的对话框,工具提示,标签页的切换,多级的下拉菜单等等,css甚至还能做...
  • baiding1123
  • baiding1123
  • 2016年07月12日 15:22
  • 1681

分享 :CSS常见面试题

CSS基础 2.1 link和@import都可以为页面引入CSS文件,其区别是? 将样式定义在单独的.css的文件里,link和@import都可以在html页面引入css文件。有link和@i...
  • u013910042
  • u013910042
  • 2015年12月22日 19:49
  • 7440

挂多个css还是新建class-多用组合,少用继承

转载于http://blog.csdn.net/hacke2/article/details/21707133 5. CSS的聚合/组合原则--挂多个class还是新建 CSS里也包含了设...
  • fengxinziyangyang
  • fengxinziyangyang
  • 2016年05月24日 16:55
  • 1096
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:css(一)
举报原因:
原因补充:

(最多只允许输入30个字)