WEB前端知识

首页 > 免费 > WEB前端知识

整理CSS常用属性

作者:admin 时间:2016-11-25   点击:3 次

整理于CSS笔记:

关于CSS作用:一是快速维护页面元素的样式属性;二是弥补HTML元素的属性不足;CSS又被称作层叠样式表。

关于CSS的元素属性:

一:首先是长度单位:

1、宽度、高度用px(像素),也可以用%(百分比)。建议使用固定值;

2、颜色单位:A.颜色的直译英文名称,如:red(红)、green(绿)、blue(蓝);十六进制表示法:#ff0000;简写十六进制:#f00;RGB表示法:rgb(255,0,0);百分比RGB:rgb(100%,0%,0%)

二:

1、宽度和高度:

大部分元素都会用到这两个属性-------> width(设置宽度)、height(设置高度)

2、边框:

border属性,设置边框的宽度、线性、颜色

表格(table)和盒子(div)因为看不到它的大小,我们一般都会用border设置显示出边框线;在border中还可以给上下左右单独设置边框线;border-top:宽度 线型 颜色;border-bottom:宽度 线型 颜色;border-right:宽度 线型 颜色;border-left:宽度 线型 颜色;线性我们有三种:none(无)|solid(实线)|dotted(点划线)。

3、内边距padding

就是设置表格或者盒子内的边距,可以设置单独上下左右和边框相同;

4、外边距margin

设置外部的边距,可单独设置上下左右。

5、控制元素的显示方式属性

可以控制元素不显示,或者以什么方式显示出来。如果不显示在此元素style中加入即可:dispaly:none(不显示)|inline(内联对象)|block(块级对象);

6、背景样式

可以设置背景图片,背景颜色,图片的平铺方式,背景图片的位置;设置背景样式(哪个部分不需要可以忽略不用写):background:背景颜色 背景图片 平铺方式 水平位置 垂直位置;背景图片----> url(图片地址) 一定要写 url 然后括号中写上图片地址;平铺方式:no-repeat(不平铺)|repeat-x(x轴平铺)|repeat-y(y轴平铺);水平位置(left|center|right);垂直位置(top|center|bottom)。

7、浮动样式

使表格或者盒子中的内容全部靠左或者全部靠右,一把导航页面都需要用到:float:left|right;

8、文本样式

line-height设置行高

text-indent;设置首行缩进;首行缩进一般用于把按钮上的文本向后隐藏

text-align:left|center|right;设置水平对齐方式

cursor:pointer;设置浏览器中鼠标形状

font-weight:normal|bold;设置文本加粗效果

text-decoration:none|underline;设置文本下划线样式;一般用于把超链接的下划线取消

9、列表样式

list-style:样式 url(图片地址) 位置(inside|outside);我们一般只设置一项,就是样式,其余可以忽略不写。list-style:none;把列表前面的实心圆或空心圆取消;用于ul,ol。

10、定位属性

定位属性:position:fixed(固定的)|absolute(绝对)|relative(相对);我们先说固定(fixed):固定定位根据屏幕所定位,但是会遮住下面的文本。所以我们通常很少用。(PS:一般广告多的网站会用);相对定位(relative):相对定位是子盒子根据父盒子定位,父盒子移动,子盒子移动;绝对定位(absolute):绝对定位根据屏幕左上角定位。一般我们用绝对定位都是用在相对定位的子盒子中;

CQTV新媒体项目运营中心 . 简米炎龙互联网运营专家!

地址:重庆市江北区观音桥华新软件产业园5F
咨询:023-67122091 023-81803811
业务QQ:1003671285 技术QQ:164983921
E - mail:1003671285@qq.com

简单 快乐 共享 共赢

  • 10年专业互联网运营经验
  • 重庆最专业WEB APP建站队伍
  • 500强集团公司网站建设供应商
  • 营销型网站建设领先者
  • 2000家成功客户经验
  • 始终坚持技术和服务同样重要
查看PC版网站
渝ICP备17000029号 版权所有:简米炎龙