CSS常用属性理解

简介: CSS常用属性理解

       提起css属性,我们自然会想到,它是指用户在HTML文档选择器中用来描述如何呈现特定元素的特性。那么它具有哪些常见属性呢?常见属性的定义是什么样的呢?又在实际使用中会遇到什么问题呢?面试常见的问题有哪些呢?让我们一一揭开这些常用属性的面纱吧!!!


一、常用属性有哪些?


       1、字体属性(font-*)


       2、颜色和背景属性(color、background-*)


       3、文本属性(文字对齐、行高等)


       4、边距属性(内外边距、边框等)


       5、布局属性(定位等)


       6、鼠标属性(cursor)


       以上这些属性都可以使用内部样式(style标签)、外部样式(link标签)和内联样式(元素属性)三种方式引入使用;


6ebca8a084ee43faa974da053a9dd695.png


b32cbbe7e78a4cc1964009aefe089578.png


01edf942d05f4a968aaf639371d90f13.png


二、常见属性的定义是什么样?


       1、字体类


font-family :设置字体样式

font-size :设置字体大小

font-weight : 设置字体粗细

font-style:设置字体样式

color :设置字体颜色

       2、颜色和背景类


color:设置字体颜色

background-color :背景颜色

background-image :背景图片

background-repeat:背景的重复方式

background-position:背景图片定位,属性值可以为数值,可以为百分比,也可以为关键字;第一个为水平方向,第二个为垂直方向

background-size:设置背景尺寸

background: 背景颜色 背景图片 背景定位 背景重复显示方式


background: #ccc url(./src/1.png) 200px 10px no-repeat;


       3、文本类


text-align:设置文本对齐方式

text-decoration:设置文本装饰方式

line-height :设置文本行高

text-indent:设置文本缩进

       4、边距类


margin-left:对象左边外延边距

margin-right:对象右边外延边距

margin—top:对象上边外延边距

margin-bottom:对象下边外延边距

padding-left:对象左边外延边距

padding-right:对象右边外延边距

padding—top:对象上边外延边距

padding-bottom:对象下边外延边距

border-width :边框粗细

border-style :边框样式 dashed :虚线 solid:实线

border-color : 边框颜色

border: 边框设置简写 边框粗细 边框样式 边框颜色


border: 1px solid #ccc;


       5、布局类


float:浮动布局

position:定位布局

flex:弹性布局

gird:网格布局

       6、鼠标类


pointer:小手

move:移动图标

text:文字选择器

crosshair:十字架

wait:等待

help:帮助

三、常用属性的实际用法?


       常用font设置字体的大小、粗细、颜色、字体类型等;需要注意的是,font本身受根元素的font大小影响,浏览器的根font-size大小是最小font;


ef5fe974caaa4d9082e0f8ad1b32e1ce.png

68a30f472b6442728e9eaaf97c5044e7.png


四、面试常见的问题有哪些?


       1、说说你对盒子模型的理解?


       2、box-sizing属性


       3、css选择器有哪些?优先级?哪些属性可以继承?


       4、说说em/px/rem/vh/vw区别?


       5、css中,有哪些方式可以隐藏页面元素?区别?


       6、谈谈你对BFC的理解?


       7、元素水平垂直居中的方法有哪些?


相关文章
|
2月前
|
前端开发
css的渐变属性linear-gradient
css的渐变属性linear-gradient
|
2月前
|
前端开发
CSS属性:盒子模型
CSS属性:盒子模型
32 0
|
2月前
|
前端开发
CSS属性
CSS属性
30 0
|
17天前
|
Web App开发 前端开发 iOS开发
css所有缩写属性,CSS属性简写整理
css所有缩写属性,CSS属性简写整理
16 1
|
2月前
|
前端开发
前端基础(五)_CSS文本文字属性、背景颜色属性
本文详细介绍了CSS中关于文本和背景颜色的样式属性。包括字体大小、字体族、字体加粗、字体样式、文本行高、`font`属性、文本颜色、文本对齐方式、文本装饰线、首行缩进等文本属性,以及背景颜色、背景图片、背景重复、背景位置等背景属性。文章通过示例代码展示了这些属性的具体应用和效果。
33 3
前端基础(五)_CSS文本文字属性、背景颜色属性
|
1月前
|
前端开发
CSS 中哪些属性可以继承
在 CSS 中,属性分为可继承与不可继承。可继承属性会在子元素中沿用父元素的样式设定。常见可继承属性包括:文本属性(如 `font-family`, `color`),列表属性(如 `list-style`),表格布局属性(如 `border-collapse`),以及其他如 `visibility` 和 `direction` 等属性。正确理解这些属性有助于更高效地进行样式设计。
|
17天前
|
前端开发
css简写属性
css简写属性
24 0
|
1月前
|
前端开发 JavaScript
如何在CSS中添加自定义属性
如何在CSS中添加自定义属性
15 0
|
1月前
|
前端开发
运用CSS伪类与属性,巧妙实现背景图片旋转效果
运用CSS伪类与属性,巧妙实现背景图片旋转效果
27 0
|
1月前
|
前端开发
哪些 CSS 属性可以继承?
哪些 CSS 属性可以继承?
41 0

热门文章

最新文章