码迷,mamicode.com
首页 > Web开发 > 详细

CSS基础知识(更新中)

时间:2016-08-11 17:52:10      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:

<meta charset="utf-8">

<link type="text/css" rel="stylesheet" href="样式文件所在链接"> 

  • <p class="x"> </p>
  • 类选择器:p.x{};;;;;;h1.x, p.x{};;;;;;.x{}
  • 。。。。。。。。。。。。。。。。。。。。。。
  • <p id="x"> </p>
  • #x{}
  • p#x{}

 

颜色:

  • color:
  • background-color;

背景图像

  • background-image:url(图像链接);
  • background-repeat:no-repeat(图像只会显示一个);
    • repeat;
    • repeat-x(只在水平方向上重复)
    • repeat-y(只在垂直方向上重复)
    • inherit(按照父元素的设置来处理)
  • background-position:top left;(左上角)

字体:

    • font-family:Verdana(PC 上),Geneva(MAC),Arial(MAC和PC),sans-serif(无衬线字体集);
    • font-size:以body的字体大小为准
      • body{font-size:small;large}相当于基本字体大小
      • h1{font-size:150%}
    • color:
    • font-weight:lighter;normal;bold;bolder;
    • text-decoration:

 

    • non
    • underline上划线
    • overline下划线
    • line-through有一条穿过的线
    • 指定样式的同时指定内容的含义:<del>{删除};<ins>{下划线,标记要插入的内容,填空?}
  • font-style:italic(斜体);(not)oblique(倾斜文本)

段落

  • line-heighe:1.6em;//各行之间的间距:[em:相对于字体大小]

盒模型

  • 内容区
  • padding:
    • padding-left:
    • padding-right:
  • border
    • border-width//边框宽度
    • border-style
      • solid 实线
      • double 两条线
      • outset外凸
      • inset 内凹
      • dotted 虚线
      • dashed 破折线
      • ridge 脊线
    • border-color
    • 合起来写:3px dotted gray;
    • 指定某一边的边框:border-top-color:……
    • top;left;right;bottom
    • 边框圆角:radius(px或者em)
  • margin
    • margin-left:
    • margin-right:

CSS基础知识(更新中)

标签:

原文地址:http://www.cnblogs.com/Thelma/p/5761422.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!