互联创盟网
创盟源码

网页设计之前端常用CSS属性收集

发布日期: 2022-09-14  人气指数: -

一、字体属性:(font)

大小font-size:x-large;(特大)xx-small;(极小)一般中文用不到,只要用数值就可以,单位:PX、PD

样式font-style:oblique;(偏斜体)italic;(斜体)normal;(正常)

行高line-height:normal;(正常)单位:PX、PD、EM

粗细font-weight:bold;(粗体)lighter;(细体)normal;(正常)

变体font-variant:small-caps;(小型大写字母)normal;(正常)

大小写text-transform:capitalize;(首字母大写)uppercase;(大写)lowercase;(小写)none;(无)

修饰text-decoration:underline;(下划线)overline;(上划线)line-through;(删除线)blink;(闪烁)


二、背景属性:(background)

色彩background-color:#FFFFFF;

图片background-image:url();

重复background-repeat:no-repeat;

滚动background-attachment:fixed;(固定)scroll;(滚动)

位置background-position:left(水平)top(垂直);

简写方法background:#000url(..)repeatfixedlefttop;


三、区块属性:(Block)

字间距letter-spacing:normal;数值

对齐text-align:justify;(两端对齐)left;(左对齐)right;(右对齐)center;(居中)

缩进text-indent:数值px;

垂直对齐vertical-align:baseline;(基线)sub;(下标)super;(下标)top;text-top;middle;bottom;text-bottom;

词间距word-spacing:normal;数值

空格white-space:pre;(保留)nowrap;(不换行)

显示display:block;(块)inline;(内嵌)list-item;(列表项)run-in;(追加部分)compact;

(紧凑)marker;(标记)table;inline-table;table-raw-group;table-header-group;table-footer-group;table-raw;table-column-group;table-column;table-cell;table-caption;(表格标题)


四、方框属性:(Box)

width:;height:;float:;clear:both;margin:;padding:;顺序:上右下左


五、边框属性:(Border)

border-style:dotted;(点线)dashed;(虚线)solid;double;(双线)groove;(槽线)ridge;(脊状)inset;(凹陷)outset;

border-width:;边框宽度

border-color:#;

简写方法border:widthstylecolor;


六、列表属性:(List-style)

类型list-style-type:disc;(圆点)circle;(圆圈)square;(方块)decimal;(数字)lower-roman;(小罗码数字)upper-roman;lower-alpha;upper-alpha;

位置list-style-position:outside;(外)inside;

图像list-style-image:url(..);


七、定位属性:(Position)

Position:absolute;relative;static;

visibility:inherit;visible;hidden;

overflow:visible;hidden;scroll;auto;

clip:rect(12px,auto,12px,auto)(裁切)


八、CSS符号属性:

list-style-type:none;/*不编号*/

list-style-type:decimal;/*阿拉伯数字*/

list-style-type:lower-roman;/*小写罗马数字*/

list-style-type:upper-roman;/*大写罗马数字*/

list-style-type:lower-alpha;/*小写英文字母*/

list-style-type:upper-alpha;/*大写英文字母*/

list-style-type:disc;/*实心圆形符号*/

list-style-type:circle;/*空心圆形符号*/

list-style-type:square;/*实心方形符号*/

list-style-image:url(/dot.gif);/*图片式符号*/

list-style-position:outside;/*凸排*/

list-style-position:inside;/*缩进*/


九、CSS连接属性:

a/*所有超链接*/

a:link/*超链接文字格式*/

a:visited/*浏览过的链接文字格式*/

a:active/*按下链接的格式*/

a:hover/*鼠标转到链接*/