![](https://img-blog.csdnimg.cn/direct/2ec6178a03f043918b38e9d5a1e9c0a3.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
CSS
文章平均质量分 90
CSS相关
欲无缘
Java后端开发 陆续分享后端分布式、中间件、 服务器运维、云原生、前端、移动开发、大数据等相关知识。
展开
-
CSS 设置背景图片
注意:经过测试,它是第一张图片的左上角到元素左上角的距离(第一张的意思是:在图片repeat铺满之前)。如果是border-box,那就是第一张图片的左上角到元素边框靠外面的哪那个左上角的距离。如:background-size : contain | cover | 100px 100px | 50% 100%;x=(容器的宽度-背景图宽度)*x百分比=(300px-200px)*50%=50px;y=(容器的高度-背景图高度)*y百分比=(300px-200px)*50%=50px;原创 2024-01-17 16:56:37 · 1833 阅读 · 1 评论 -
CSS 网页布局
在html4.01等之前的版本中html并没有专用的布局元素,而是统统使用div进行布局。网页主体 左右两侧可以放置侧边栏等 内部可以放置正文aricle标签。用来放置一篇完整的文章 一般这种文章内部可以再次嵌套页眉页脚。注意:圣杯布局一般存在左侧和右侧两个侧边栏,此处我们仅书写一个。一般使用在div上,不能使用在table中。box-shadow:三个偏移量 阴影颜色。一般放置网站的联系地址,加盟信息,版权等。标签一般用来嵌套网页的标题,搜索栏,导航栏等。设置圆角边框,数字越大边框越圆。原创 2024-01-17 16:08:04 · 670 阅读 · 1 评论 -
CSS 浮动 & 定位
只能书写一个元素定位之后,不再保持原先的类型,不再占满一行,漂浮在页面上,原来的位置被之后的 元素递补占据 如果元素的祖先元素都没有被定位过,则根据body也就是浏览器的左上角进行定位 注意这样可能会出现问题。默认的块元素会占满父元素的宽度,设置浮动之后,按照设置浮动的方向 进行缩小,缩小到内部的内容的宽度为准,之后漂浮在页面上,原先的位置被后面的 元素递补占据。元素根据原先所在位置的左上角进行定位,定位之后,元素依然 保持原先的类型,原来的位置依然被占用 偏移量。原创 2024-01-17 11:45:08 · 1204 阅读 · 1 评论 -
CSS 基本选择器 & 复合选择器
使用标签名作为选择元素的依据,一般极少单独使用,非常容易引起误操作,因为精确分辨相同标签元素。根据左祖先右后代的继承原则,可以精确拿取具有层级关系的子元素 没有个数限制。在css中,没有任何冲突的前提下,子标签会完全继承父标签的所有css渲染设置。由一个标签后面紧跟.类别或者#id,则必须同时满足两个条件才可以成功选取。根据.class属性值精确选取元素,class全文不唯一,可以随意使用。使用#id值来拿取元素,注意id全文唯一,不能出现重复。存在冲突,则以子标签为准。/* 文本倾斜 */原创 2024-01-15 17:21:11 · 536 阅读 · 0 评论 -
三种引入CSS的方式
Cascading Style Sheet 层叠样式表前端三大基础之一(Html结构 CSS样式 JS动作)最早由网景公司(Netscape)提出,在1996年受到w3c的认证,发布了第一版,迄今为止已经是第四版,专门用来负责页面的样式 取代了Html同时渲染结构和样式造成的页面混乱。使用html同时渲染页面样式和结构的弊端:结构样式耦合在一起,浏览器解析困难,可读性差,毫无代码重用性。原创 2024-01-15 16:44:44 · 1258 阅读 · 0 评论 -
CSS常见元素类型 & 盒子模型
在css中所有的元素在没有设置任何定位 浮动 等参数的前提下从上到下默认依次排列的顺序称之为标准文本流由于大部分元素都是块元素所以,基本上所有的元素一行只能存在一个从上往下排列在制作页面时,一般首先写好html,呈现标准文本流的状态,然后统一书写css具有先后顺序,而不是html和css同时书写。的形态从上往下排列,盒子具有四个边框,边框外为margin 边框内为padding边框为border通过设置border属性可以显示元素的边框。在css中将所有的元素看做一个具有四个边框的矩形盒子,这些盒子按照。原创 2024-01-16 11:01:50 · 1109 阅读 · 0 评论