认识css及其基本属性

今天药忘吃喽~ 2022-12-25 13:53 153阅读 0赞

### css 层叠样式表(cascading style sheet) ###

css1.0/2.0/3.0

<style type="text/css"> 其样式很多，例less,可使用变量
    
    /*css语法*/
    
    对象{
    
    属性：属性值；
    
    属性：属性值；
    
    属性：属性值；
    
    ...
    
    }
    
    </style>

### css外部样式创建 ###

### 外部样式导入法2(100%不用)： ###

行内样式（内联样式）---不准用

直接标签内style=“”

css属性 /\*像素的单位要带上\*/（常用）

宽度：width:1000px;

高度：height:100px

背景颜色：background-color:red;

浮动：让元素横向排列 float: ;

### css文本属性 ###

*  文本大小 font-size:20px;
 *  文本颜色 color:；
 *  文本字体 font-family:字体1，字体2，字体3；
 *  文字加粗 font-weight:bolder(更粗的)/bold(加粗)/normal(常规字)/900-100(600-900加粗，100-300细，400-500微粗)主要记100，500，900;
 *  文字倾斜 font-style:italic（倾斜）/oblique（取消倾斜）/normal(常规显示);
 *  水平对齐方式 text-align:left/right/center/justify（两端对齐中文不起作用）;
 *  文字行高 line-height:normal/value;(在指定的高度中上下居中)
 *  文本修饰 text-decoration:none（去掉下划线）/underline(添加下划线)/overline（添加上划线）/line-through（删除线）;
 *  首行缩进 text-indent:20px;只对第一行起作用
 *  margin:auto 居中
 *  img\{vertical-align: top;\} 此代码用来解决图片往下掉的问题
 *  字间距：letter-spacing:12px;(左右间距)

### css背景属性 ###

背景颜色background-color:

背景图片:background-image：url(背景图片的路径及全称)；

插入图片：属于网页内容，也就是结构。

背景图：属于网页的表现，背景图上可以显示文字、插入图片、表格等。

背景图片的显示原则:

A）容器尺寸等于图片尺寸，背景图片正好显示在容器中

B）容器尺寸大于图片尺寸，背景图片将默认平铺，直至铺满元素；

C）容器尺寸小于图片尺寸，只显示元素范围以内的背景图。

背景图片平铺属性：

background-repeat:no-repeat/repeat/repeat-x/repeat-y

no-repeat:不平铺