phpStudy
phpStudy
网站首页
软件下载
PHP教程
编程技术
PHP
MySQL
HTML
CSS
JavaScript
MSSQL
AJAX
.NET
JSP
window
Linux
Mac
ASP
服务器
CMS
SQL
jQuery
C#
C++
java
Android
IOS
oracle
MongoDB
PostgreSQL
SQLite
教程手册
php
html
html5
css
css3
JavaScript
ajax
jquery
sql
ado
asp
aspnet
browsers
careers
dhtml
dotnetmobile
dtd
e4x
glossary
hosting
htmldom
json
media
msnet
quality
rdf
rss
schema
semweb
site
sitemap
smil
soap
svg
tags
tcpip
vbscript
w3c
wap
web
webservices
wmlscript
wsdl
xforms
xhtml
xlink
xml
xmldom
xpath
xquery
xsl
xslfo
网站测速
小皮面板
智能dns
搜索
首页
PHP教程
CSS实用教程(三)
CSS实用教程(三)
十二.控制BOX的样式
样式表规定了一个容器BOX,它将要储存一个对象的所有可操作的样式。包括了对象本身、边框空白、对象边框、对象间隙四个方面。
为了大家更好地理解这些属性的意义,以及互相之间的关系,请看下面这个图示:
1.边框空白(MARGIN)
如图所示,位于BOX模型的最外层,包括四项属性。
格式分别如下:
?margin-top:顶部空白距离
?margin-right:右边空白距离
?margin-bottom:底部空白距离
?margin-left:左边空白距离
空白的距离可以用带长度单位的数字表示。
如果使用上述属性的简化方式margin,可以在其后连续加上四个带长度单位的数字,来分别表示margin-top、margin-right、margin-bottom、margin-left,每个数字中间要用空格分隔。
2.对象边框(BORDER)
如图所示,位于边框空白和对象空隙之间,包括了七项属性。
格式分别如下:
?border-top:顶边框宽度
?border-right:右边框宽度
?border-bottom:底边框宽度
?border-left:左边框宽度
?border-width:所有边框宽度
?border-color:边框颜色
?border-style:边框样式参数
其中border-width可以一次性设置所有的边框宽度,border-color同时设置四面边框的颜色时,可以连续写上四种颜色,并用空格分隔。上述连续设置的边框都是按border-top、border-right、border-bottom、border-left的顺序。
Border-style相对别的属性而言稍稍复杂些,因为它还包括了多个边框样式的参数:
?none:无边框。
?dotted:边框为点线。
?dashed:边框为长短线。
?solid:边框为实线。
?double:边框为双线。
?groove:根据color属性显示不同效果的3D边框
?ridge:根据color属性显示不同效果的3D边框
?inset:根据color属性显示不同效果的3D边框
?outset:根据color属性显示不同效果的3D边框
3.对象间隙(PADDING)
如图所示,位于对象边框和对象之间,包括了四项属性。
基本格式如下:
?padding-top:顶部间隙
?padding-right:右边间隙
?padding-bottom:底部间隙
?padding-left:左边间隙
和MARGIN类似,PADDING也可以用padding一次性设置所有的对象间隙,格式也和MARGIN相似,不再一一列举了。
十三.显示控制样式
基本格式如下:
display: 参数
参数取值范围:
?block(默认):在对象前后都换行
?inline:在对象前后都不换行
?list-item:在对象前后都换行,增加了项目符号
?none:无显示
十四.空白控制样式
基本格式如下:
空白属性决定如何处理元素内的空格。
white-space: 参数
参数取值范围:
normal:把多个空格替换为一个来显示
pre:忠实地按输入显示空格
nowrap:禁止换行
但要注意的是,write-space也是一个块级属性。
.全文完.
本文作者:
«
»
PHP教程
PHP简介
PHP基本语法
PHP类型
PHP变量
PHP运算符
PHP控制结构
PHP函数
PHP类与对象
PHP异常处理
函数库分类
快速导航
PHP
MySQL
HTML
CSS
JavaScript
MSSQL
AJAX
.NET
JSP
Linux
Mac
ASP
服务器
SQL
jQuery
C#
C++
java
Android
IOS
oracle
MongoDB
SQLite
wamp
交通频道
Copyright © 2016 phpStudy | 豫ICP备2021030365号-3