![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
文章平均质量分 76
明里灰
不愤不启 不悱不发.
展开
-
sass的学习
语法差异,scss是对sass的一种改进,他引入了更接近标准的css语法,更适合直接转换为css代码。sass中的多行注释(/**/)会显示在原文中,单行注释(//)不会限制在原文中。它的目的是扩展其他选择器,html代码中并没有使用该类,以百分号开头。在嵌套css规则时,有时也需要直接使用嵌套外层的父选择器。实际上是同一种技术的不同叫法。原创 2024-01-29 23:04:58 · 620 阅读 · 0 评论 -
flex布局和grid布局
1.1 flex是一维布局系统,适合做局部布局,比如导航栏组件因为一个flexbox一次只能处理一个维度上的元素布局,一行或一列对于网格来说是一维布局,多行是1.5维,以内容为基础,内容自适应没有放下是你空间自由分配,自动对齐1.2 flex布局flex容器flexbox的区域是flex容器,如果要创建一个flex容器,应该把一个容器的display属性值改为flex或者inline-flex。然后里面的直系子元素就会变为flex元素,紫云阿苏CSS属性都会有一个初始值,如下:原创 2023-12-17 20:45:43 · 796 阅读 · 0 评论 -
CSS的学习1
内部样式当单个文档需要特殊样式时,就应该使用内部样式表,你可以使用标签定义内部样式表。提示:单个页面内的CSS代码具有统一性和规划性,便于维护,但是在多个页面之间容易混乱。 h3{ color:red; font-size:30px; } 外部样式当样式需要应用于很多页面时,外部样式表是理想的选择。在使用外部样式表的情况原创 2023-06-09 02:24:15 · 612 阅读 · 0 评论 -
CSS的学习2
文档流文档流是文档中可显示对象在排列时所占用的位置/空间例如:块元素自上而下摆放,内联元素从左到右摆放标准流中的限制很多,导致很多页面无法实现高矮不齐,底边对齐空白折叠现象无论多少个空格,换行,tab,都会折叠为一个空格无论我们想要img标签之间没有空隙,必须紧密连接文档流产生的问题高矮不齐,底边对齐文本内容 img{ width:原创 2023-06-19 00:15:44 · 1273 阅读 · 0 评论 -
CSS的学习3
CSS是层叠样式表的简称,又称为CSS样式表或级联样式表。CSS是一种标记语言。主要用于设置HTML页面中的文本内容(字体、大小、对齐方式等)、图片的外形(宽高、边框样式、边距等)、版面的布局和外观显示样式。由HTML专注去做结果呈现,样式交给CSS,即结构(HTML)与(CSS)分离。原创 2023-07-04 09:23:28 · 107 阅读 · 1 评论 -
CSS的学习4(盒子模型及浮动)
上是5px右10px下20px 左30px(顺时针)对于两个嵌套关系(父子关系)的块元素,父元素有上外边距,同时子元素上也有上外边距,此时父元素会塌陷较大的外边距值。网页元素很多带有默认的内外边距,而且不同浏览器默认的也不一致,所以在布局前,首先要清除网页元素的内外边距。行内元素为了照顾兼顾性,尽量只设置左右内外边距,不要设置上下内外边距,但是转换为块级和行内块元素就可以了。//上是5px,左右是10px,下是20px。边框(border)原创 2023-07-05 22:49:12 · 385 阅读 · 0 评论 -
CSS隐藏页面元素的几种方法
display:none渲染树不会渲染对象,元素不可见不占据空间无法响应点击事件修改元素会造成文档回流,读屏器不会读取display: none元素内容,性能消耗较大visibility: hidden渲染元素继续占据空间,只是内容不可见无法响应点击事件修改元素只会造成本元素的重绘,读屏器读取visibility: hidden元素内容,性能消耗较小transition 支持 visibility,visibility 会立即显示,隐藏时会延时opacity:0占据空间,只是内容不可见原创 2023-11-28 09:15:49 · 412 阅读 · 0 评论