css
爱笑的小宇宙
这个作者很懒,什么都没留下…
展开
-
css实现水平/垂直居中的方式
水平居中分为块状元素和行内元素,而块状元素又分为定宽块状元素和不定宽块状元素。1、行内元素水(display: inline)平居中(文本、图片等)是通过给父元素设置 text-align:center;来实现的。<p style="text-align: center;">行内元素水平居中</p>2、定宽块状元素(dispaly: block)水平居中(块状元素的width是一个固定值),满足块状和定宽两个条件时,即可通过给自己设置“左右margin为auto”来实现转载 2020-11-10 14:31:33 · 586 阅读 · 0 评论 -
正确的让文本换行
通常文本换行我们会使用word-break属性,有两个值供我们选择word-break: break-all;word-break: break-word;那么如何区分这两个值呢,我们看图说话,你就明白了。对于处理英文字符没有任何区别,但是好戏还在后头,处理一些特殊符号差别可就大了...原创 2020-11-10 14:21:30 · 638 阅读 · 0 评论 -
css 实现div内显示两行或三行,超出部分用省略号显示
一、div内显示一行,超出部分用省略号显示white-space: nowrap;overflow: hidden;text-overflow: ellipsis;二、div内显示两行或三行,超出部分用省略号显示overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-cla...转载 2020-01-20 19:32:31 · 3481 阅读 · 0 评论 -
CSS如何实现文字隐藏 超出文字隐藏 鼠标移入显示
原创 2020-01-14 14:13:28 · 2415 阅读 · 0 评论 -
CSS3中width属性的width: calc(100% - 20px); 使用问题
目的是动态改变宽度/高度的变化,适配问题。width: calc(100% - 20px);css3 的 calc()函数。这里的意思是设置宽度比100%的宽度少20px。calc()函数用于动态计算长度值。 calc()函数支持 "+", "-", "*", "/" 运算;calc()函数使用标准的数学运算优先级规则;...原创 2019-12-26 16:00:14 · 25866 阅读 · 1 评论 -
浅谈script标签中的async和defer
defer和async是script标签的两个属性,用于在不阻塞页面文档解析的前提下,控制脚本的下载和执行。 在介绍他们之前,我们有必要先了解一下页面的加载和渲染过程:页面的加载和渲染过程浏览器通过HTTP协议请求服务器,获取HMTL文档并开始从上到下解析,构建DOM; 在构建DOM过程中,如果遇到外联的样式声明和脚本声明,则暂停文档解析,创建新的网络连接,并开始下载样式文件和脚本文件;...原创 2019-10-24 22:20:49 · 311 阅读 · 0 评论 -
Flex 弹性布局使用及说明
https://blog.csdn.net/qq_38543537/article/details/78436434Flex布局在实际布局中的应用场景https://www.9xkd.com/course/3156177602.html原创 2019-10-24 00:01:20 · 203 阅读 · 0 评论 -
三栏布局
https://www.cnblogs.com/chengzp/p/layout.html关于 Flex 中的 flex-grow、flex-shrink、flex-basis原创 2019-10-15 11:16:29 · 77 阅读 · 0 评论 -
position的absolute与fixed共同点与不同点
这个问题面试被问到过~~position属性是对于元素位置设置的属性,一般来说fixed是相对于window窗口的不会随着页面的滚动而位置发生变化absolute是相对于页面中的元素位置设置的,所以位置会随着页面的滚动而发生变化,不会固定不变。如果页面没有滚动条的时候,两者的效果是一样的。fixed:固定定位absolute:绝对定位区别很简单:1、没有滚动条的情况下没有差...原创 2019-09-29 11:02:50 · 4022 阅读 · 0 评论 -
3.列举不同的清除浮动的技巧,并指出他们各自的使用场景
https://blog.csdn.net/miss_zxm/article/details/79377825https://blog.csdn.net/h_qingyi/article/details/81269667原创 2019-09-29 10:21:24 · 404 阅读 · 0 评论 -
1.怎么样使一个 div 居中于浏览器中间
https://www.cnblogs.com/qiye2016/p/5492983.html原创 2019-09-29 10:05:19 · 585 阅读 · 0 评论 -
CSS盒子塌陷问题解决方案
一,盒子塌陷是什么?本应该在父盒子内部的元素跑到了外部。二,为什么会出现盒子塌陷?当父元素没设置足够大小的时候,而子元素设置了浮动的属性,子元素就会跳出父元素的边界(脱离文档流),尤其是当父元素的高度为auto时,而父元素中又没有其它非浮动的可见元素时,父盒子的高度就会直接塌陷为零, 我们称这是CSS高度塌陷。下图下方两个子元素的盒子分别设置了左浮动和右浮动,顶端的长条盒子出现了塌...原创 2019-10-15 11:24:59 · 487 阅读 · 0 评论