CSS学习笔记
文章平均质量分 82
测试小实战
这个作者很懒,什么都没留下…
展开
-
CSS学习笔记九——布局形式
两栏布局与三栏布局一、两栏布局将窗口划分为左右两栏,常用于左边为导航栏,右边为内容的形式。设置左边固定,右边自适应宽高的布局方法一:先设置窗口自适应,左边盒子设置固定宽度,右边盒子通过 margin-left 空出左边位置且宽度自适应,左右盒子均设置高度百分百及左浮动;方法二:先设置窗口自适应,左边盒子设置固定宽度,右边盒子宽度设为 calc(100% - 左边盒子的固定宽度),左右盒子均设置高度百分百及左浮动;calc 函数用于动态计算长度值,其运算符前后需保留一个空格原创 2022-02-04 17:02:54 · 679 阅读 · 0 评论 -
CSS学习笔记八——宽高自适应
宽高自适应一、宽度自适应二、高度自适应三、浮动元素的高度自适应一、宽度自适应不写宽度或者写 width:auto就表示宽度自适应,可用于横栏或导航栏。与 width:100%不同,设为100%已经固定了宽度,宽度始终不变,而宽度自适应是会自动更改宽度,前者在设置 padding 时横向出现滚动条,后者在设置 padding 时会自动压缩宽度大小。有 min-width、max-width 属性,max-width 用于图片上可避免拉大屏幕时图片失真。二、高度自适应原创 2022-02-04 16:29:36 · 12982 阅读 · 0 评论 -
CSS学习笔记七——定位属性
定位属性position 属性是定位属性,可让某个元素显示在某个位置。其取值有:static、absolute、relative、fixed 和 sticky。 1. static 静态定位(默认值)按照文档流顺序,从左到右、从上到下,与元素显示类型有关;不支持 top、left、right、bottom;2. relative 相对定位相对自己原来的位置移动;不脱离文档流,仍然占据文档流位置,下一元素不会顶上来;可以覆盖在其它元素上;原创 2022-01-29 17:17:57 · 1053 阅读 · 0 评论 -
CSS学习笔记六——元素显示类型
元素显示类型一、块元素 1. 块元素在网页中以块的形式显示,即矩形区域显示; 2. 默认情况下,块元素独占一行,且按顺序自上而下排列; 3. 块元素可自定义宽高; 4. 块元素一般作为其他元素的容器,可以容纳其它内联元素和块元素,这种容器也可称为盒子 5. 块元素会默认添加 display:block 属性值,但 li 标签会默认添加 display:list-item 属性值,表示让该元素显示为列表类型,通常该属性值也归类在块元素中; 6. 注意 p 标签中可以放文本,但不能放块元素;原创 2022-01-27 23:12:34 · 730 阅读 · 0 评论 -
CSS学习笔记五——CSS常见属性二
CSS常见属性二一、浮动与清浮动属性浮动属性作用:1、让网页的其它文本环绕某一元素显示;2、让竖着放置的元素横向展示;浮动属性就是 float 属性,其取值有 left、right、none(默认)。多个元素设置浮动时,会平行并列显示,见缝插针,先浮动的最靠边。一个元素在设置了 float 属性后会漂浮起来,其下方的元素会顶上其所在的位置,此时,漂浮起来的元素可能会覆盖其下方元素的一部分(高度塌陷1),且下方元素的文字会被挤到一边显示。原创 2022-01-27 18:01:36 · 277 阅读 · 0 评论 -
CSS学习笔记四——盒子模型
一、盒子模型内边距padding 属性,设置元素内容与边框之间的距离,即内边距,如:padding: 20px。该属性会改变盒子占用的位置。取值:(1)1个值,4个方向内边距一致(2)2个值,上下一致,左右一致(3)3个值,按照上 左右 下的顺序设值(4)4个值,按照上 右 下 左的顺序,顺时针设值原创 2022-01-27 15:40:09 · 591 阅读 · 0 评论 -
CSS学习笔记三——CSS常见属性一
一、文本属性 1. 字体大小 font-size:单位是 px,浏览器默认16px,设计图常用字号是12px; 2. 字体 font-family:字体中有空格时,需加双引号,且可设置多重字体,用逗号间隔,浏览器解析时,先以第一个字体解析,没有该字体时解析第2个字体,以此类推; 3. 颜色 color:三种取色方式,一是写对应颜色的英文单词,如:red、purple;二是十六进制写法(0-9,A-F),任意搭配,如:#00FFAA,#FFFFFF(六个值一样可省略为 #FFF);三是 rgb 配色原创 2022-01-25 21:29:18 · 300 阅读 · 0 评论 -
CSS学习笔记二——选择器
CSS学习笔记二一、选择器选择器,也可叫选择符,主要在 CSS 想对 HTML 页面中的元素实现一对一,一对多或多对一的控制时所使用。1. 元素选择器元素选择器,又叫类型选择器。主要是将一个大类的标签名称当做选择器使用,所有的页面元素都可以作为选择器使用,缺点在于范围太广。CSS代码如下:div{ background-color: yellow;}2. 类选择器类选择器,也是 class 选择器,给标签设置类名,常用于给原创 2022-01-25 15:37:03 · 375 阅读 · 0 评论 -
CSS学习笔记一——基本语法及样式表
一、CSS基本介绍CSS(Cascading Style Sheets)层叠样式表,是 WEB 标准中的表现标准语言,主要用于修饰网页信息的显示样式,目前推荐遵循 W3C 发布的 CSS 3.0,最基本要学会CSS 2.0的写法。二、基本语法 1. 每个CSS样式由两部分组成,即 选择符和声明,声明又分为属性和属性值; 2. 属性必须放在 花括号 中,属性与属性值用 冒号 连接; 3. 每条声明用分号结束; 4. 当一个属性有多个属性值的时候,属性值与属性值不分先后顺序用 空格 隔开;原创 2022-01-22 11:00:00 · 905 阅读 · 0 评论