ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

CSS 学习记录(1)一些琐碎的内容

2022-01-29 22:01:35  阅读:147  来源: 互联网

标签:记录 琐碎 选择符 设置 div font border CSS 属性


CSS学习记录

1、CSS语法

1.1 基本语法

1、使用选择符来说明CSS的作用范围

2、声明语句放在选择符后面的大括号内,多个声明语句是用分号隔开

1.2选择符

A.类选择符 class='name', 以.name{}进行渲染

1、类选择符必须以点号开头

2、类名只能包含字母、数字、连字符和下划线,切必须以字母开头

3、区分大小写

B.表选择符

标签名{属性1:值;属性2:值;}

C.id选择符

#id选择符{属性1:值;属性2:值;}

D.包含选择符

层层嵌套标签,中间使用逗号隔开

1.3样式表

1、内嵌式

2、内部样式

3、外部样式(推荐)

2、盒子模型

2.1概念

content+border+padding+margin

内容区域由:width+height构成

padding&border&margin: top&bottom&left&right

2.2 border属性

2.2.1 width属性

border-top/bottom/right/left-width:1px; border-width:1px 2px 3px #上边框1px,左右边框2px,下边框3px

2.2.2 color 设置边框颜色

2.2.3可以通过border综合属性进行border的综合设置

2.2.4 border-radius 指从左上角开始,顺时针设置各个弧角的半径

2.3 margin

按照上右下左顺时针方向进行设置

如若需要将几个div进行居中,这些div放入一个打的div中,并将这个大的div进行渲染,具体

div{ margin:0 auto; }

盒子的宽度&高度计算=文本内容宽度+边框宽度+外边距宽度

3、文本样式

3.1字体样式

1、font-family——控制字体

2、font-size——控制大小

3、font-style——设置元素的字形

4、font-weight——字体粗细

5、font综合属性设置

3.2文本样式

1、text-indent——设置缩进

2、text-align——设置对齐

3、line-height设置行高

4、text-shadow设置阴影

5、text-decoration设置下划线(underline)上划线(overline)删除线(line-through)以及闪烁(blink)

6、word-spacing(单词间隔)letter-spacing(字符间隔)

标签:记录,琐碎,选择符,设置,div,font,border,CSS,属性
来源: https://blog.csdn.net/Phoenix1st/article/details/122748186

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有