大小

width   宽               body {   min-width:1200px;

height  高                      }                            -- 设定页面最小宽度

背景

background-color:____               -- 背景色

background-image :url( 地址  )    -- 背景图

background-repeat: ____           -- 背景图的平铺方式

repert   平铺

no-repert      不平铺

repert-x        x 轴平铺

repert-y        y 轴平铺

background-position :____         -- 背景图片位置

center       居中

right  top   右上角

left 100px  top  200px     距左侧100像素,距离上200像素

background-size : _(像素/百分比)              -- 背景图的大小

background-attachment: _____               -- 背景图片是否浮动

fixed    背景固定锁住

scroll    背景随字体浮动

字体

font-family: ___          --  字体        一般默认为“微软雅黑”

font-size :___             --  字号

font-style:___             -- 字体是否倾斜

italic       倾斜

normal   不倾斜

font-weight____         -- 字体是否加粗

bold       加粗

normal   不加粗

font-decoration____       -- 设置下划线

underline      下划线

overline        上划线

line-trough    删除线

none             去掉超链接的下划线

color      -- 字体颜色

对齐方式

text-align: ____              --  水平对齐方式

center  居中对齐

left   左对齐

right   右对齐

vertical-align: ____           -- 垂直对齐方式

top    顶部对齐

bottom    底部对齐

middle      居中

vertical-align:middle

display:table-cell          -- 两者配合方能垂直对齐。

line-height:____      -- 行高

text-indent:____     -- 缩进

边界边框

margin      -- 外边距,四周边框与外部的距离

margin:10px;                       四个方向的边距都是10像素

margin:50px  0 ;                  上下 50 像素,左右0

margin-top:10px;                 上边框与其他元素的距离,

margin:10px  0  10px  0 ;      按 上、右、下、左 的顺序与其他元素的距离

padding        -- 内边距,内容与边框的距离

padding:10px;   内容与边框最短的距离是10像素,

--  文字所占的空间大小不变,将四个边框向外延伸10像素

padding: 20px  0  20px  0 ;    上、右、下、左的边距

border  --  边框

border-width:5px;    边框的粗细

border-style:solid;    边框的样式(虚,实等)

border-color:red;      边框的颜色

border: 2px  solid  red ; (简写)

列表方块

list-style:none       将序列的序号图案去掉

list-style-image:url( 图片地址 );  将序号变为图片

隐藏

display: none;       隐藏     -- 隐藏位置不保留

block;       显示

visibility: hidden;   隐藏    -- 隐藏后位置保留

visible;   显示

overflow: hidden                -- 超出部分隐藏

scroll      加滚动条

透明

opacity:0.5;                       -- 对谷歌,360等高等浏览器有用

-moz-opacity:0.5;               -- 针对火狐浏览器

flter:alpha (opacity=50);     -- 针对 IE 浏览器

圆角                                                         -- 无法用于IE浏览器

border-radius:5px;        将边框的角削去5个像素

阴影                                                         -- 无法用于IE浏览器

box-shadow: 50px  0  30px  black

--  左右偏移(右正左负)、上下偏移(上正下负)、阴影扩散成度、阴影颜色

CSS 样式属性的更多相关文章

  1. js中获取css样式属性值

    关于js中style,currentStyle和getComputedStyle几个注意的地方 (1)用js的style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的.针对css ...

  2. IE6支持兼容min-width、max-width CSS样式属性

    IE6支持兼容min-width.max-width CSS样式属性 让IE6支持max-width.IE6支持min-width样式 我们在写CSS的时候,常常会遇到让一个图片或一个布局不能超出设定 ...

  3. HTML布局相关的CSS样式属性

    # 转载请留言联系 注意,样式属性是写进CSS里面的. 布局常用样式属性: width 设置元素(标签)的宽度,如:width:100px; height 设置元素(标签)的高度,如:height:2 ...

  4. CSS样式属性单词之Left

    通常left单独在CSS中设置无效,需要在使用position属性下使用才能生效起作用.left左靠多少距离(距离左边多少)的作用. left 一.left认识与语法 left翻译:左边,左 在CSS ...

  5. 常用CSS样式属性

    01.常用样式 1.1.background背景 设置元素背景的样式 background,更好的衬托内容. 属性 描述 值 background 背景属性简写.支持多组背景设置,逗号,隔开 back ...

  6. IE6支持min-width、max-width CSS样式属性

    1.IE6支持max-width解决方法 IE6支持最大宽度,解决CSS代码: .yangshi{ max-width:1000px; _width:expression((document.docu ...

  7. 11-18网页基础--第二部分CSS样式属性(1)

    第一课:样式属性 style 样式:style样式不仅可以直接在<body>中设置成整个网页的样式.格式:为了将样式.格式多样化,也可以将style单独抽出来,作为一个独立的个体,放在&l ...

  8. CSS样式属性——字体+文本

    CSS属性可分为以下几类:字体.背景.文本.位置.布局.边缘.列表 1. 字体——主要包括文字的字体.大小.颜色.显示效果等基本样式 font-family:用于设置字体系列 font-size:字体 ...

  9. CSS样式属性分类

    A 文字 1 font-family:字体名称 注意: 当指定多种字体时,用“,”分隔每种字体的名称 当字体名称包含两个以上分开的单词是,用“”把该字体名称括起来. 当样式规则外已经有“”时,用‘’代 ...

  10. Jquery中animate可以操作css样式属性总结

    可以用 animate() 方法来操作所有 CSS 属性吗? 是的,几乎可以!不过,需要记住一件重要的事情:当使用 animate()时, 必须使用 Camel 标记法书写所有的属性名,比如,必须使用 ...

随机推荐

  1. 利用CPaintDC::IntersectClipRect将绘图限制在局部区域

    问题背景:画带坐标的图,例如 画里面那条曲线的时候,希望将绘图区域局限在坐标范围内,范围外的就自动屏蔽掉. 两个方案,一是用CPaintDC的SelectClipRgn函数,感觉略麻烦.另一个函数,就 ...

  2. .NET MVC 学习笔记(六)— 数据导入

    .NET MVC 学习笔记(六)—— 数据导入 在程序使用过程中,有时候需要新增大量数据,这样一条条数据去Add明显不是很友好,这时候最好就是有一个导入功能,导入所需要的数据,下面我们就一起来看一下导 ...

  3. ASP.NET MVC 实现有论坛功能的网站(有iis发布网站)

    ASP.NET MVC. M 为Model模型层, V 为View视图层, C 为Controller控制层.要想使用MVC框架来写网站就需要了解M V C 的作用分别为哪些.给大家简单的介绍一下: ...

  4. Spring IOC 容器源码分析系列文章导读

    1. 简介 Spring 是一个轻量级的企业级应用开发框架,于 2004 年由 Rod Johnson 发布了 1.0 版本.经过十几年的迭代,现在的 Spring 框架已经非常成熟了.Spring ...

  5. 06_python_小数据池/ is == /编码

    一.小数据池 1.代码块 python程序是由代码块构成的.一个代码块的文本作为python程序执行的单元.代码块: 一个模块, 一个函数, 一个类, 甚至每一个command命令都是一个代码块. 一 ...

  6. spring cloud学习(六) 配置中心-自动更新

    上一篇学习了spring cloud config的基本使用,但发现有个问题,就是每次更改配置后,都需要重启服务才能更新配置,这样肯定是不行的.在上网查资料了解后,spring cloud支持通过AM ...

  7. 爬虫:Scrapy5 - 选择器Selectors

    当抓取网页时,常见的任务是从HTML源码中提取数据.现有的一些库可以达到这个目的: BeautifulSoup lxml Scrapy 提取数据有自己的一套机制.它们被称作选择器(seletors), ...

  8. mybatis四大接口之 StatementHandler

    1. 继承结构 StatementHandler:顶层接口 BaseStatementHandler : 实现顶层接口的抽象类,实现了部分接口,并定义了一个抽象方法 SimpleStatementHa ...

  9. jQuery的ajax的post请求json格式无法上传空数组

    问题描述:在和后端对接时,使用jquery的ajax的post方式向后端传递一序列约定好格式的对象数组.遇到了一个现象:如果对象中的数组是空数组,那么在请求参数中是不会出现的. 以下是数据的对比:   ...

  10. CSS中text-shadow的几个好看的文字demo及其代码

    最近有看到一些镂空的或者立体的文字设计图非常好看,然后想了想,应该是使用text-shadow来实现的,这里我贴出我仿的八个demo,分享给大家 首先是HTML代码 <div class=&qu ...