在线客服
扫描二维码
下载博学谷APP
扫描二维码
关注博学谷微信公众号
CSS常用样式属性有哪些?CSS样式属性有两种分别是局常用样式属性和文本常用样式属性,CSS的作用是美化HTML网页和控制页面布局,我们需要掌握这两种常用的样式属性来美化页面。接下来一起学习下经常使用的样式属性。

1、布局常用样式属性
•width设置元素(标签)的宽度,如:width:100px;
•height设置元素(标签)的高度,如:height:200px;
•background设置元素背景色或者背景图片,如:background:gold;设置元素的背景色,background:url(images/logo.png);设置元素的背景图片。
•border设置元素四周的边框,如:border:1pxsolidblack;设置元素四周边框是1像素宽的黑色实线
•以上也可以拆分成四个边的写法,分别设置四个边的:
•border-top设置顶边边框,如:border-top:10pxsolidred;
•border-left设置左边边框,如:border-left:10pxsolidblue;
•border-right设置右边边框,如:border-right:10pxsolidgreen;
•border-bottom设置底边边框,如:border-bottom:10pxsolidpink;
•padding设置元素包含的内容和元素边框的距离,也叫内边距,如padding:20px;padding是同时设置4个边的,也可以像border一样拆分成分别设置四个边:padding-top、padding-left、padding-right、padding-bottom。
•margin设置元素和外界的距离,也叫外边距,如margin:20px;margin是同时设置4个边的,也可以像border一样拆分成分别设置四个边:margin-top、margin-left、margin-right、margin-bottom。
•float设置元素浮动,浮动可以让块元素排列在一行,浮动分为左浮动:float:left;右浮动:float:right;
2、文本常用样式属性
•color设置文字的颜色,如:color:red;
•font-size设置文字的大小,如:font-size:12px;
•font-family设置文字的字体,如:font-family:'微软雅黑';为了避免中文字不兼容,一般写成:font-family:'MicrosoftYahei';
•font-weight设置文字是否加粗,如:font-weight:bold;设置加粗font-weight:normal设置不加粗
•line-height设置文字的行高,如:line-height:24px;表示文字高度加上文字上下的间距是24px,也就是每一行占有的高度是24px
•text-decoration设置文字的下划线,如:text-decoration:none;将文字下划线去掉
•text-align设置文字水平对齐方式,如text-align:center设置文字水平居中
•text-indent设置文字首行缩进,如:text-indent:24px;设置文字首行缩进24px
3、布局常用样式属性示例代码

4、文本常用样式属性示例
CSS样式属性小结:设置不同的样式属性会呈现不同网页的显示效果,样式属性的表现形式是:属性名:属性值。
— 申请免费试学名额 —
在职想转行提升,担心学不会?根据个人情况规划学习路线,闯关式自适应学习模式保证学习效果
讲师一对一辅导,在线答疑解惑,指导就业!
相关推荐 更多
《编程小白的第一本Python入门书》读书笔记
对于编程零基础初学者来讲,Python入门选择看什么样的书是很重要的。第一本Pthon入门书的内容要精简,不然新手学了很久,都还在死磕基础知识。书的难度也不能太高,不然缺乏基础的学习者会看不懂,从而失去学习兴趣。因此在这里,小编要向大家推荐,一本最适合零基础学习者的书——《编程小白的第一本Pthon入门书》。
8316
2019-08-23 18:26:39
学习python技术难吗?
Python语言的就业前景会非常好。相对于其他来说,它语法简单易读,消除了初学者对于“编程”这一行为的恐惧,让越来越多的非科班有信心开始通过编写简单的程序,究竟学习python技术难吗?关键在于你多注意小编这几点。
6163
2020-05-04 16:49:13
多个装饰器如何使用?代码如何实现?
装饰器函数在被装饰函数定义好的时候立即执行,以“自下而上”的顺序进行;掌握多个装饰器的操作,使用多个装饰器装饰一个函数。
4370
2021-12-02 13:48:50
MySQL数据库的基本使用之数据库
MySQL数据库的基本使用之数据库,数据库是存储和管理数据的仓库,数据按照一定的格式进行存储。数据库起到存储和管理数据的作用。
4120
2022-01-10 14:06:11
闭包如何使用?能解决什么问题?
闭包如何使用?能解决什么问题?闭包可以保存外部函数内的变量,且不会随着外部函数调用完而销毁。我们学习闭包需要掌握了解闭包的作用。
5168
2022-02-12 11:20:57
