随笔分类 -  HTML

1 2 3 下一页
设置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)
Python——文件上传
摘要：_1、原始方法： 表单设置enctype="multipart/form-data" 在视图中通过request.FILES来获取文件对象 将文件保存到磁盘 def uploaded_file(f): """ 保存文件 """ with open('media/file/name.jpg', 'wb 阅读全文
posted @ 2020-12-25 15:13 嘆世殘者——華帥 阅读(278) 评论(0) 推荐(0)
js基础
摘要：——————————————————创建节点的四种方法 创建元素节点：document.createElement() 创建文本节点：document.createTextNode() <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <tit 阅读全文
posted @ 2020-06-14 18:35 嘆世殘者——華帥 阅读(124) 评论(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 嘆世殘者——華帥 阅读(165) 评论(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)
清除浮动的三种方法
摘要：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)
圣杯布局和双飞翼布局
摘要：布局要求： 1、三列布局，中间宽度自适应，两边定宽 2、中间栏要在浏览器中优先展示渲染 3、允许任意列的高度最高 4、用最简单的css、最少的HACK语句 圣杯布局： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>圣杯布局</ 阅读全文
posted @ 2020-06-03 16:49 嘆世殘者——華帥 阅读(165) 评论(0) 推荐(0)
position之absolute居中定位
摘要：.parent { position: relative; width: 200px; height: 150px; background: blue; } .child { position: absolute; width: 80px; height: 80px; background: red 阅读全文
posted @ 2020-06-01 15:03 嘆世殘者——華帥 阅读(197) 评论(0) 推荐(0)
鼠标经过图片切换
摘要：通过onMouseOver和onMouseOut事件来改变<img>的src属性，从而实现了鼠标经过图片切换的效果。 <img src="1.jpg" onMouseOver="this.src='2.jpg'" onMouseOut="this.src='1.jpg'"> 阅读全文
posted @ 2020-05-23 22:58 嘆世殘者——華帥 阅读(168) 评论(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)
table添加水平滚动条
摘要：<html> <head> <title>table新增水平滚动条</title> <style type="text/css"> .tableWrap { overflow: auto; } table{ width: 100% } table th{ white-space: nowrap; } table td{ white-space: nowrap; } </style> </head> 阅读全文
posted @ 2019-11-06 11:34 嘆世殘者——華帥 阅读(597) 评论(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 嘆世殘者——華帥 阅读(149) 评论(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中的Js动画与Velocity.js的结合
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Vue中的Js动画与Velocity.js的结合</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script src="js/velocity.min.js"></scr 阅读全文
posted @ 2019-10-31 16:08 嘆世殘者——華帥 阅读(180) 评论(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)

1 2 3 下一页