CSS 样式属性
大小
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 样式属性的更多相关文章
- js中获取css样式属性值
关于js中style,currentStyle和getComputedStyle几个注意的地方 (1)用js的style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的.针对css ...
- IE6支持兼容min-width、max-width CSS样式属性
IE6支持兼容min-width.max-width CSS样式属性 让IE6支持max-width.IE6支持min-width样式 我们在写CSS的时候,常常会遇到让一个图片或一个布局不能超出设定 ...
- HTML布局相关的CSS样式属性
# 转载请留言联系 注意,样式属性是写进CSS里面的. 布局常用样式属性: width 设置元素(标签)的宽度,如:width:100px; height 设置元素(标签)的高度,如:height:2 ...
- CSS样式属性单词之Left
通常left单独在CSS中设置无效,需要在使用position属性下使用才能生效起作用.left左靠多少距离(距离左边多少)的作用. left 一.left认识与语法 left翻译:左边,左 在CSS ...
- 常用CSS样式属性
01.常用样式 1.1.background背景 设置元素背景的样式 background,更好的衬托内容. 属性 描述 值 background 背景属性简写.支持多组背景设置,逗号,隔开 back ...
- IE6支持min-width、max-width CSS样式属性
1.IE6支持max-width解决方法 IE6支持最大宽度,解决CSS代码: .yangshi{ max-width:1000px; _width:expression((document.docu ...
- 11-18网页基础--第二部分CSS样式属性(1)
第一课:样式属性 style 样式:style样式不仅可以直接在<body>中设置成整个网页的样式.格式:为了将样式.格式多样化,也可以将style单独抽出来,作为一个独立的个体,放在&l ...
- CSS样式属性——字体+文本
CSS属性可分为以下几类:字体.背景.文本.位置.布局.边缘.列表 1. 字体——主要包括文字的字体.大小.颜色.显示效果等基本样式 font-family:用于设置字体系列 font-size:字体 ...
- CSS样式属性分类
A 文字 1 font-family:字体名称 注意: 当指定多种字体时,用“,”分隔每种字体的名称 当字体名称包含两个以上分开的单词是,用“”把该字体名称括起来. 当样式规则外已经有“”时,用‘’代 ...
- Jquery中animate可以操作css样式属性总结
可以用 animate() 方法来操作所有 CSS 属性吗? 是的,几乎可以!不过,需要记住一件重要的事情:当使用 animate()时, 必须使用 Camel 标记法书写所有的属性名,比如,必须使用 ...
随机推荐
- 使用PerfView监测.NET程序性能(四):折叠,过滤和时间范围选择
在上一篇文章中,我们使用了Perfview的分组功能.分组功能旨在对某些函数按照某个格式进行分组,以减少视图中的各种无关函数的数量.但仅有分组还不够,有时我们想将一些函数调用信息按某些条件过滤掉,例如 ...
- 在windows10上创建ASP.NET mvc5+Memcached服务
感谢两位两位大佬: https://blog.csdn.net/l1028386804/article/details/61417166 https://www.cnblogs.com/running ...
- Speech Synthesis
<Window x:Class="Synthesizer.MainWindow" xmlns="http://schemas.microsoft.com/winfx ...
- 面向对象三大特性编写面向对象程序,self到底是谁
一.函数式编程和面向对象的对比 面向过程:根据业务逻辑从上到下写垒代码: 函数式:将某功能代码封装到函数中,日后便无需重复编写,仅调用函数即可: 面向对象:对函数进行分类和封装,让开发“更快更好更强. ...
- Redis中的批量操作Pipeline
大多数情况下,我们都会通过请求-相应机制去操作redis.只用这种模式的一般的步骤是,先获得jedis实例,然后通过jedis的get/put方法与redis交互.由于redis是单线程的,下一次请求 ...
- Swift5 语言参考(一) 关于语言参考
本系列文章的这一部分描述了Swift编程语言的形式语法.此处描述的语法旨在帮助您更详细地理解语言,而不是允许您直接实现解析器或编译器. Swift语言相对较小,因为Swift代码中几乎无处不在的许多常 ...
- Apache JMeter的基本使用
安装 安装地址:http://jmeter.apache.org/download_jmeter.cgi 解压后运行jmeter.bat的批处理文件就可以了 JMeter测试脚本编写: 1,创建线程组 ...
- tkinter的grid布局中合并单元格
rowspan 合并多行,比如:Label(root,text="table",width=10,height=2,),grid(row=0,column=0,rowspan=2 ...
- POJ 2405
#include <iostream> #include <cmath> #include <iomanip> #define pi 3.1415926536 us ...
- javascript数据结构与算法---检索算法(二分查找法、计算重复次数)
javascript数据结构与算法---检索算法(二分查找法.计算重复次数) /*只需要查找元素是否存在数组,可以先将数组排序,再使用二分查找法*/ function qSort(arr){ if ( ...