CSS3 - 随笔分类 - 嘆世殘者——華帥

设置overflow:hiden出现偏移现象

摘要：原因：元素默认对齐方式是基线对齐即（vertical-align：baseline），设置设置overflow不为visible之后改变了他的默认对齐方式；导致其它元素出现下沉的视觉效果。解决方法：重新设置所有行内元素的对齐方式为vertical-align:top或者bottom 阅读全文

posted @ 2021-08-31 23:01 嘆世殘者——華帥阅读(64) 评论(0) 推荐(0)

Python Flask 构建微电影视频网站

摘要：Github：https://github.com/lgsp-Leslie/flask_movie Python：3.9 Mysql：8.0.17 Flask==1.1.2 flask-redis==0.4.0 Flask-SQLAlchemy==2.5.1 Flask-WTF==0.14.3 my 阅读全文

posted @ 2021-05-21 18:17 嘆世殘者——華帥阅读(430) 评论(0) 推荐(0)

HTML5标签兼容低版本IE浏览器

摘要：利用document.createElement创建当前浏览器（IE6-8）不支持的标签名 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> article { c 阅读全文

posted @ 2020-06-14 15:46 嘆世殘者——華帥阅读(166) 评论(0) 推荐(0)

CSS-自定义变量

摘要：定义 :root{ --bg_color:#FAFAFA; } 用法 div {background-color:var(--bg_color);} 阅读全文

posted @ 2020-06-14 14:44 嘆世殘者——華帥阅读(131) 评论(0) 推荐(0)

图片控制

摘要：方法一：控制图片外框高度，让布局正常，图片不出现拉伸 <div class="left_img"> <img class="img-responsive center-block" src="img/index/j.png" alt="" /> </div> .section3 .left_img 阅读全文

posted @ 2020-06-12 15:58 嘆世殘者——華帥阅读(162) 评论(0) 推荐(0)

多行文本溢出显示省略号

摘要：多行文本溢出显示省略号 <style type="text/css">.section3 .title_leftDiv { height: 42px; margin-bottom: 10px;}.section3 .text_leftDiv { margin-bottom: 10px; height 阅读全文

posted @ 2020-06-12 11:27 嘆世殘者——華帥阅读(103) 评论(0) 推荐(0)

基于jQuery实现点击列表加载更多效果

摘要：CSS .section1 { padding-top: 58px; padding-bottom: 125px; position: relative;}.section1 div.news_list>div { margin-bottom: 6px; } .section1 .news_list 阅读全文

posted @ 2020-06-11 15:17 嘆世殘者——華帥阅读(277) 评论(0) 推荐(0)

div+radio模拟select

摘要：HTML <div class="section1"> <div class="container"> <div class="row"> <div class="col-xs-12 col-sm-6"> </div> <div class="col-xs-12 col-sm-6"> <div cl 阅读全文

posted @ 2020-06-10 11:50 嘆世殘者——華帥阅读(214) 评论(0) 推荐(0)

链接标签属性、其他属性

摘要：链接标签属性 sizes <link rel="icon" href="icon.gif" type="image/gif" sizes="16" > target <base href="http://localhost/" target="_blank" > 超链接 a:media=""(表示对阅读全文

posted @ 2020-06-04 22:49 嘆世殘者——華帥阅读(178) 评论(0) 推荐(0)

清除浮动的三种方法

摘要：1、 <div class="clear"></div> .clear { clear: both; } 2、 <div class="container clearfix"> <div class="div1">333</div> <div class="div1">333</div> <div 阅读全文

posted @ 2020-06-03 18:00 嘆世殘者——華帥阅读(120) 评论(0) 推荐(0)

解决IE9以下不兼容H5、媒体查询

摘要：1、解决ie9以下浏览器对html5新增标签的不识别，并导致CSS不起作用的问题。 2、让不支持css3 Media Query的浏览器包括IE6-IE8等其他浏览器支持查询。 head部分添加如下代码 <!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元阅读全文

posted @ 2020-04-27 17:33 嘆世殘者——華帥阅读(259) 评论(0) 推荐(0)

Vue动画的封装

摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Vue动画的封装</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <style type="text/css"> .fade1-enter, .fade1-leave-to 阅读全文

posted @ 2019-10-31 18:55 嘆世殘者——華帥阅读(150) 评论(0) 推荐(0)

Vue中的列表过渡

摘要：Vue中的列表过渡 {{item.title}}————{{item}} Add ... 阅读全文

posted @ 2019-10-31 18:18 嘆世殘者——華帥阅读(136) 评论(0) 推荐(0)

Vue中多个元素或组件的过渡

摘要：Vue中多个元素或组件的过渡 Harold Hello toggle ... 阅读全文

posted @ 2019-10-31 16:27 嘆世殘者——華帥阅读(205) 评论(0) 推荐(0)

Vue中使用animate.css库

摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Vue中使用animate.css库</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <link rel="stylesheet" type="text/css" href= 阅读全文

posted @ 2019-10-30 11:52 嘆世殘者——華帥阅读(187) 评论(0) 推荐(0)

html引用公共的头部和尾部（多个html文件共用一个header.html和footer.html）、导航跳转页面改变导航样式

摘要：将header部分和footer部分提取出来，各保存为header.html和footer.html。 header.html（P.S.1：此次有导航跳转页面改变导航样式） footer.html 其他html引入头部尾部，如： index.html 阅读全文

posted @ 2019-09-18 10:40 嘆世殘者——華帥阅读(2409) 评论(0) 推荐(0)

css3 position fixed固定居中问题解决方案

摘要：fixed使对象脱离了正常文档流解决方案：阅读全文

posted @ 2019-09-17 10:01 嘆世殘者——華帥阅读(260) 评论(0) 推荐(0)

背景图片自适应大小(css3)

摘要：body { background: url(/img/index.jpg) no-repeat center center fixed; background-size: 100%; } 阅读全文

posted @ 2019-06-01 18:52 嘆世殘者——華帥阅读(973) 评论(0) 推荐(0)

实现单行、多行——文本溢出显示省略号

摘要：一、单行溢出单行文本的溢出显示省略号，这种做法我们通常用text-overflow来实现，然后给元素定宽，超出隐藏二、多行文本溢出 1、采用的:after来解决的 2、js的方法来实现阅读全文