css常用样式
border: border-width border-style border-color (边框属性)
全部属性
div
{width:100px;
height:100px;
border-style:solid;
border-width:1px;
border-color:#ccc;} 缩写属性
div
{width:100px;
height:100px;
border:1px solid #ccc;
}
border-radius 圆角效果
div
{border-radius:30px;}
所有边框角度设置为30px的圆角 div
{border-radius:50%}
一个圆
border-image 边框图片
div
{border-images: url(图片路径) ; }
box-shadow 盒子阴影
div {
width: 100px;
height: 100px;
background-color: #ff0000;
box-shadow: 5px 5px rgba(0, 0, 0, .6); }
<div>
<box-shadow></box-shadow>
</div>
外阴影效果
line-height(行高) text-indent(段落缩进) text-align(段落对齐)
p { line-height: 10px;
text-indent:2em; /*缩进两个字符*/
text-align:center;} /*段落居中对齐*/
letter-spacing(文字间距)
p
{ letter-spacing :10px;}
background-color
div
{ background-color:#ff0000;}
RGBA(RGB色彩标准,A为透明参数)
div
{background-color:#200, 69, 88, 0.5}
红 绿 蓝 透明参数
linear-gradient(渐变色彩)
div
{width: 400px;
height: 400px;
background-image:linear-gradient(to left, red 30%,blue);}
线性渐变 从右到左 30%的红 到蓝
background-image(背景图片) background-repeat(平铺方式)
div
{background-image:url(图片路径);
background-repeat: repeat-x;
} 平铺方式:x轴平铺
background-position(背景定位)
div
{background-position:left top;}
左对齐 上对齐
background(缩写)
div
{background:#EDEDED url(图片路径) no-repeat 50% 30px;}
背景色 背景图片 平铺方式 定位
css常用样式的更多相关文章
- CSS常用样式及示例
CSS常用样式及示例 一.简介 层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集) ...
- CSS常用样式(四)之animation
上篇CSS常用样式(三)这篇博文中已经介绍过了CSS中具有动画效果的transition.transform,今天来大概说说CSS中的animation.animation的加入会使得动画效果更加乐观 ...
- 从零开始学习前端开发 — 9、标签嵌套规则及CSS常用样式覆盖
1. 块级元素可以包含内联元素或某些块级元素,但内联元素却不能包含块级元素,它只能包含其它的内联元素: <div><h1></h1><p></p& ...
- css常用样式对文本的处理演练
CSS文本属性可定义文本的外观,这是毫无疑问的,其次css可以通过以下属性改变文字的排版,比方说letter-spacing实现字符间距text-indent: 2em;完成首行缩进2字符word-s ...
- css常用样式font控制字体的多种变换
CSS 字体属性定义文本的字体系列.大小.加粗.风格(如斜体)和变形(如小型大写字母)font-family控制字体,由于各个电脑系统安装的字体不尽相同,但是基本装有黑体.宋体与微软雅黑这三款字体,通 ...
- CSS常用样式属性
1.CSS字体和文本相关属性 属性 font-family 规定文本的字体系列,比如:“serif” ''sans-serif" font-size 规定文本的字体尺寸 font-style ...
- css常用样式属性详细介绍
对于初学css的来说,肯定会觉得这么多样式不好记,而且记住了也容易忘,其实刚开始我们不用去记这么多的样式,确实是记了也会忘,刚开始只需记住一些常用的就可以了,然后在慢慢的使用过程当中接触并学习一些高级 ...
- CSS常用样式整理
元素边框显示圆角:-moz-border-radius适用于火狐浏览器,-webkit-border-radius适用于Safari和Chrome两种浏览器. 浏览器渐变背景颜色: FILTER: p ...
- css 常用样式命名规则
大家在写css的时候,对一些html标签起一个合适的名字是个很头疼的事情,现在给大家分享项目中常用的名字供参考. 外套:wrap ——用于最外层 头部:header ——用于头部 主要内容:mai ...
- CSS常用样式--font
CSS font 属性 参考:W3school- CSS font 所有浏览器都支持 font 属性,可在一个声明中设置所有字体属性,各属性需按顺序,语法如下: selector{ font:styl ...
随机推荐
- REVERSE
REVERSE函数,刚刚接触,这是一个Oracle和MS Sql都能用的,不知道是不是T-SQL标准的函数,反正能用,挺好 SELECT REVERSE('abcd') 结果为dcba,就是把字符串反 ...
- 景区3D指纹验证系统解决方案
旅游业已成为全球经济中发展势头最强劲和规模最大的产业之一.旅游业在城市经济发展中的产业地位.经济作用逐步增强,旅游业对城市经济的拉动性.社会就业的带动力.以及对文化与环境的促进作用日益显现.指纹门票为 ...
- exel中合并一列相同的数据到一行
Sub 按钮1_Click() Application.ScreenUpdating = False arr = Range("a1:c" & [a65536].End(x ...
- js设计模式总结-单例模式
单例模式 解决的问题 保证实例只有一个,避免多个实现,从全局来看,这个实例的状态是唯一的. 实现原理 设置一个变量来记录实例,通过检测该变量是否为空来决定是否创建实例 非透明单例 所谓非透明就是用户在 ...
- Stl源码剖析读书笔记之Alloc细节
阅读基础: Foo *pf = new Foo; 执行了两个步骤: 1)::operator new 向系统申请内存. 2) 调用Foo::Foo()构造函数构造实例. ==> 申请内存,构造 ...
- redis安装
参考redis.io 安装步骤 下载,编译reids $ wget http://download.redis.io/releases/redis-3.0.6.tar.gz $ tar xzf red ...
- Android BadgeView使用
BadgeView是第三方的插件,用来显示组件上面的标记,起到提醒的作用,下载地址如下:http://files.cnblogs.com/files/hyyweb/android-viewbadger ...
- IT关键词,发现与更新,点成线,线成面,面成体
时序图 1.什么是时序图 2.如何看懂时序图 3.时序图的作用 4.如何绘制时序图 分布式 一个业务分拆多个子业务,部署在不同的服务器上. 分布式是指将不同的业务分布在不同的地方. 而集群指的是将几台 ...
- PHPStorm技巧篇 -- 观感优化
(1)设置默认显示行号 (2)设置自动换行 (3)去除代码下划线(拼写检测) 优化说明:自动换行和显示行号字面意思很好理解,下划线说明一下,phpstorm默认对代码进行拼写校验,即对于不符合英文单词 ...
- build.fxbuild打不开 Failed to create the part's controls
Failed to create the part's controls 以文本形式打开之后,发现编码的地方不是常用编码 将之修改为GBK 然后就可以正常打开了 最后把eclipse中的编码统一设置为 ...