- 博客(8)
- 收藏
- 关注
RSS订阅原创 纯CSS实现一个气泡框
实现原理：主要通过CSS的border-color属性，结合::before、::after和position: absolute实现。 （1）画一个正方形或长方形的盒子，别忘记此盒子需加上position: relative，不然之后的绝对定位元素会相对于其余设了position: relative的父级元素或windom定位，绝对定位元素就会跑偏了。 <div class="div...
2019-08-20 08:07:42
2659
原创 HTML5新属性contentEditable实现textarea
兼容性：所有主流浏览器都支持contentEditable属性 定义：规定元素内容是否可编辑，true为可编辑，false为不可编辑 示例：使用div实现一个textarea <div className={styles.textarea} contentEditable="true"></div> .textarea{ width: 300px; ...
2019-08-14 23:28:22
338
原创 HTML5新增API
参考：http://www.68kejian.com/page/study/course/94/536 HTML5浏览器支持：最新版本的 Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 将支持某些 HTML5 特性。 一、新CSS选择器 // html <ul id="elementId" name...
2019-08-13 23:12:41
251
原创 JS常用方法及举例说明
1、String字符串 字符串是一个对象，不属于js的类型，可用for循环。值不可变，操作时字符串的值看起来改变实际是指向变了，指向一个新的地址，原先的值并未改变。 （1）lenght：获取字符串长度 let str="abcdefg"; console.log(str.length)//str的长度为7 （2）chartAt(index)：返回index位置的字符，长度超出为空字符串 ...
2019-08-12 22:26:19
282
原创 清除浮动
HTML结构 <div class="parent"> 父盒子 <div class="floatLeft">浮动左边盒子</div> <div class="floatRight">浮动左边盒子</div> </div> CSS代码 注：此CSS单纯为了展示居中的效果，不涉及居中的代码，读者可...
2019-08-08 23:27:50
95
1
原创 事件委托（事件代理）
什么是事件委托： 由于JS的冒泡机制，子元素触发的事件会冒泡到父元素上，事件代理就是将子元素触发的事件代理到父元素上。 举例说明： <ul id="ul"> <li>li标签一</li> <li>li标签二</li> <li>li标签三</li> </ul> 需求：鼠标...
2019-08-08 23:12:37
224
1
原创 DIV+CSS布局之左边宽度固定，右边宽度自适应
HTML结构 <div class="parent"> <div class="leftBox">左边宽度固定盒子</div> <div class="rightBox">右边宽度自适应盒子</div> </div> 相关CSS代码 注：以下CSS为Less写法，读者可转换成原生CSS，...
2019-08-06 19:34:35
667
1
原创 CSS常用居中方式
HTML结构 注：该HTML为React写法，也可使用原生HTML代替。 <div className={styles.parent}> <div className={styles.children}>子盒子</div> </div> （1）绝对定位盒子居中 .parent { position: relative;...
2019-08-05 23:46:08
167
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人