CSS
hcq29
29的前端之路
展开
-
【CSS】CSS清除浮动的几种方法- Clear floating
文章目录Clear-floating元素怎样浮动?浮动的应用场景清除浮动的方法方法1: 底部插入:clear:both;方法2:为父元素添加overflow: auto;方法3: 伪元素方法4: 双伪元素Clear-floatingCSS清除浮动的几种方法: Clear floatingGitHub链接(可下载体验):https://github.com/hcq29/Clear-floati...原创 2020-01-13 15:21:39 · 415 阅读 · 0 评论 -
【CSS】常用的水平、垂直居中以及居中布局的方法(对内容有具体分析)
文章目录前言正文水平居中的方法text-align + display:inline-block前言前面我总结过一篇关于几种水平和垂直居中方法的文章,可以知道,实现水平居中和垂直居中的方法真的是数不清,但是各自都会有各自的优缺点,想要在实际的应用当中去正确的使用这些方法,就要靠平时的积累,熟悉掌握几种就可以应付绝大部分的居中问题。最近我又学习到了几种神奇的方法,这就来分享一下。正文水平居中...原创 2019-11-20 10:03:36 · 748 阅读 · 0 评论 -
【CSS】精简代码实现自适应!学到了!
文章目录前言正文总结前言大家是不是对css有共同的感觉就是,调这里那里不行,调那里这里又不行。。。今天学习了一个很神奇的方法,自适应!迫不及待想分享。只能说还是要靠积累,学以致用。正文先来个列表<div class="main"> <ul> <li> <h2>Hi!</h2> </li>...原创 2019-11-18 00:35:09 · 784 阅读 · 0 评论 -
【CSS】几种让元素居中的方法(包括垂直居中和水平居中),网页示图
目录前言正文一、让元素垂直居中显示的几种方法二、让元素水平居中显示的几种方法三、垂直居中一起使用的方法(上述结合使用)总结前言实现元素居中其实有很多方法,掌握一种其实是不够的,因为在不同的布局和需求面前,就要选择不同的解决方案,有时候自己在设计页面的时候,居中也是一个比较苦恼的问题,下面就来分析一下各种实现居中的方法,以及不同场合的使用情况。正文一、让元素垂...原创 2019-10-17 17:23:22 · 1058 阅读 · 0 评论 -
【CSS】Position实战定位
position属性理解概念:1、static(静态定位):默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。2、relative(相对定位):生成相对定位的元素,通过top,bottom,left,right(可设置)的设置相对于其正常(原先本身)位置进行定位。可通过z-index进行层次分级。3、absolute...原创 2018-11-27 23:14:46 · 142 阅读 · 2 评论 -
【前端之路】通过css让移动端与pc端自适应
跨平台移动WEB技术一、目的1、了解什么是响应式WEB设计2、掌握CSS3媒体查询的使用3、熟悉什么是栅格系统4、掌握弹性盒布局5、掌握汉堡菜单的制作二、制作一个页面: 1、PC端为国字型布局,移动端为上下布局 2、必须有导航(不少于4个),移动端将导航收起,变为汉堡菜单。 3、页面中的文字和图片能够自适应设备大小...原创 2019-04-11 00:04:38 · 5044 阅读 · 0 评论 -
【CSS】 纯css让文本溢出呈现...
前言:之前不知道CSS可以解决文本溢出呈现...,想到的就是JS的方法,将多余的字省略后面的变为...但是这样的话就会收到宽度或者高度的变化的局限,不足以装下预设的字数。那就来介绍一个纯CSS的办法吧!!直接上代码:.content{ width: 100%; <!--设置长度 --> font-size:32rpx; display:-webkit...原创 2019-05-15 22:58:50 · 118 阅读 · 0 评论