HTML5
关注
分享
扫一扫
海涛高软
这个作者很懒，什么都没留下…
展开
-
$.ajax上传图片
<form class="form-horizontal m-t" action="/vedio/album/save" id="signupForm" enctype="multipart/form-data" method="post"> <div class="form-group"> <label class="col-sm...原创 2019-12-28 15:35:54 · 985 阅读 · 0 评论 -
springboot上传一张图片
FR:徐海涛（hunk Xu)QQ技术交流群：386476712原创 2019-12-28 10:31:01 · 118 阅读 · 0 评论 -
three.js 制作建一个简单的模型编辑器
<!DOCTYPE html><html><head> <title>three.js - demo2</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, user-scal...原创 2019-10-26 18:48:29 · 5854 阅读 · 0 评论 -
css浮动一个练习
html代码：<body><div class="div01">div01</div><div class="div02"> <div class="nei01">nei1</div> <div class="nei02">nei2</div> <div class="nei03">nei3</div> <div class="nei04">nei4</div>原创 2016-10-04 09:38:32 · 1147 阅读 · 0 评论 -
CSS实现猎豹浏览器首页标签切换效果
效果截图： 下面是实现的代码：<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>仿毒霸首页中标签页制作</title> <style> .container { width: 280px; height: 220px;原创 2016-10-04 10:07:54 · 1095 阅读 · 0 评论 -
（浮动+盒模型+无序列表）实现切换图片效果
下面做个毒霸首页中图片切换的效果，如下： 实现代码如下：<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> .zong { width: 600px; height: 70px;原创 2016-10-04 22:03:20 · 3455 阅读 · 0 评论 -
（CSS+盒模型+dl列表）实现 毒霸首页中模块部分的布局
具体要实现毒霸界面的如下截图部分：使用 dl、dt、 dd标签来实现上面的图片功能，我使用的工具是webstorm，这个工具非常强大，无论从代码提示、界面还是从快捷键上，这个web前端的软件可以说表现的非常强大上面的每一行就是一个dl标签拿第一行举例，如果我把第一行中的购物用dt表示， 京东商城用一个dd表示，唯品会也用一个dd表示，除了更多标签使用右浮动意外，其它的标签使用左浮动，那么做出的效果如原创 2016-10-07 13:42:05 · 664 阅读 · 0 评论 -
（浮动+盒模型+ul列表 ） 分析火狐首页布局
今天分析的是下面的这张图： 下面这张图实现思路分析，上边导航条是一个大的div,div里面放的是一个ul列表，然后对每一个li项做左浮动，再配合盒模型将位置分开，下边是一个大的div 下面这张图实现思路： 绿色方框，每一个方框是一个div 上边绿色方框内部，分左右两栏，左栏是一个ul里列表，右栏中放入两个ul列表 下边绿色方框，也分左右两栏，左栏中又分两个div,上面的div又分两栏，下面原创 2016-10-08 06:37:14 · 753 阅读 · 0 评论 -
CSS选择器
.se p .se子孙中查找所有的p元素 .se > p .se儿子中查找所有的p元素.se , p .se元素和p元素div.se p 从带.se的div元素中查找所有p元素css选择器 ：http://www.w3school.com.cn/cssre...原创 2019-05-22 18:31:40 · 112 阅读 · 0 评论 -
padding：3px 4px 2px 6px与padding：3px 4px与padding：3px 4px 6px
上，右，下，左，即顺时针次序padding:6px与padding:6px 6px6px 6px效果相同如果仅给出两个或三个值，那么缺失边的属性值将取与对边相同的值padding:4px 6px与padding:4px 6px 4px 6px 效果相同padding:2px 4px 6px与padding:2px 4px 6px 4px的效果相同FR：徐海涛...原创 2019-07-06 14:36:18 · 995 阅读 · 0 评论 -
bootstrap后台模板源码中 添加一个水平线
<div class="hr-line-solid"></div>修改一下css样式表.hr-line-solid{border-top:1px solid #D3D3D3;color:#fff;background-color:#FAEBD7;height:1px;margin:20px 0}FR：徐海涛（hunk Xu)QQ技术交流群：38...原创 2019-07-24 15:16:42 · 1081 阅读 · 0 评论 -
webstorm字体字号设置
FR:徐海涛（hunk Xu）QQ技术交流群：386476712原创 2019-08-04 22:20:43 · 781 阅读 · 0 评论 -
Vue 简单案例练习
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>Vue 测试实例</title> <style> /* 可以设置不同的进入和离开动画 */ /* 设置持续时间和动画函数 */ ...原创 2019-08-08 17:31:41 · 1157 阅读 · 0 评论 -
CSS中的固定布局和相对布局
在讲固定布局和相对布局之前先回顾一下流动布局、冻结布局以及绝对布局流动布局，不在流中，但是浮动元素的边界会影响内联元素的流动，分左浮动和右浮动，注意要配合宽度width属性一起使用 冻结布局： body下弄个div容器，嵌套所有内容，然后给这个容器设定宽度和左右margin设置成auto绝对布局： 不在流中，真的会被其它块元素完全忽视，注意其位置是相对于父元素而言固定布局不在流中，会被其它元素完全忽原创 2016-10-03 22:55:15 · 7494 阅读 · 0 评论 -
CSS中冻结布局
符合以下两条的布局均可叫冻结布局：1 在body下弄个div,这个div套住body下的所有内容 2 设置步骤一种div的margin-left和margin-right为auto ，以及设定width下面就是冻结布局的一个效果截图：FR:海涛高软（Hunk Xu) QQ技术交流群：386476712原创 2016-10-03 22:34:00 · 1930 阅读 · 0 评论 -
CSS中的绝对布局
最后效果如下： 元素3 被设置成绝对定位，代码如下：一定要注意，局对定位的元素是相对于父节点而言被设置成绝对定位的元素会被流完全忽视，并且绝对定位的元素的边界不会影响其它块元素中包含的内联元素的流向FR：徐海涛（Hunk Xu)原创 2016-10-03 21:52:30 · 816 阅读 · 0 评论 -
快速将固定宽度布局转换成响应式布局
只需要引入bootstrap提供的响应式样式表 ，即bootstrap-responsive.cssFR:徐海涛（Hunk Xu)原创 2016-09-22 17:51:06 · 1427 阅读 · 0 评论 -
blockquote和abbr标签
简称标签abbr： <abbr class="initialism" title="xu hai tao">xht</abbr>网页效果如下：引用文字标签blockquote： <blockquote> xuhaitao haitao gao ruan <small>徐海涛</small></blockquote>网页效果如下： FR:徐海涛（Hunk Xu)原创 2016-09-22 18:40:17 · 422 阅读 · 0 评论 -
Bootstrap开发环境只需3行代码
特别强调：第一张图中jquery脚本的引入要放在bootstrap脚本引入的前面，否则你的页面是没有交互效果的FR:海涛高软 （http://www.xuhaitao123.com/）原创 2016-09-23 20:30:06 · 856 阅读 · 0 评论 -
bootstrap+excanvas 实现图表面板
bootstrap面板代码基本骨架： FR:徐海涛（Hunk Xu)原创 2016-09-25 10:05:49 · 1482 阅读 · 1 评论 -
bootstrap 超链接变按钮
<a href="#"> xuhaitao </a>上面代码效果如下： btn btn-default ：变成一个按钮样子 btn-lg : 大号的按钮 btn-block : 按钮填充整个宽度FR:海涛高软 （QQ技术交流群：386476712）原创 2016-09-25 11:53:00 · 12498 阅读 · 0 评论 -
Bootstrap 导航条
说明： 导航条首先是一个无序列表 .nav 把列表前面小黑点去掉 .navbar-nav 实现水平方向排列 .navbar-right 实现右对齐导航条中的下拉列表其实就是列表项中又内嵌一个无序列表最后效果： FR:海涛高软（Hunk Xu)原创 2016-09-24 15:25:51 · 399 阅读 · 0 评论 -
html5新标签介绍
HTML5的新标签元素有：<header> 定义页面或区段的头部；<footer> 定义页面或区段的尾部；<nav> 定义页面或区段的导航区域；<section> 页面的逻辑区域或内容组合；<article> 定义正文或一篇完整的原创 2016-09-22 14:56:44 · 407 阅读 · 0 评论 -
Bootstrap 页面分析
1 页面一2 页面二FR:海涛高软 （QQ技术交流群：386476712）原创 2016-09-24 17:38:53 · 651 阅读 · 0 评论 -
网页前端工程师必备技术
Jquery，Jquery mobile，bootstrap, zeptohighchartsAJAXAngularJS、Backbone、ReactJS、vueJSweb前端自动化构建流程Grunt/Gulp/webpack移动端UI组件框架（FrozenUI、jQuery Mobile、Bootstrap、Kendo UI、Amaze UI等）有微信公众平台开发经验优先有JS和本地原创 2016-09-28 09:08:58 · 661 阅读 · 0 评论 -
HTML 切换标签页的效果
效果画面： 代码：<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> .waiwei { width: 350px; height: 400px; backgroun原创 2016-10-03 15:03:39 · 5130 阅读 · 1 评论 -
盒模型+浮动做页面布局
下面是一个很常见的页面布局：主要运用原理如下： 1 使用div来划分大的块，注意div是块元素，块元素之间是要有换行的 2 如把某个块元素被设置为浮动，那么它就不在正常的流当中，后面的块元素就会忽视该浮动元素并且会占据本来属于浮动元素的位置 3 浮动元素虽然会被其后的块元素所忽略，但是记着浮动元素会影响其后的块元素中所包含的内联元素 4 实现分页，必须配合margin-right或margi原创 2016-10-03 15:55:41 · 476 阅读 · 0 评论 -
流动布局的一个demo
所谓流动布局就是在布局中使用float配合width做界面的布局下面看看一张图： 实现上面布局的思路： 1 1、2、3、4、5是5个div 2 1、2、3、5均给定了元素的高 3 2和3设置为右浮动从上面的布局可以看出，块元素会完全忽视浮动元素，这一点从元素4身上可以很好的体现，由于元素2和3被设置成右浮动，就会被排除出流块元素中包含的内联元素还是受浮动元素的边界影响<!DOCT原创 2016-10-03 19:47:02 · 759 阅读 · 0 评论 -
响应式布局
因为min-width 是大于等于的关系，就需要大的放后面，否则会发生覆盖下面的这张图实现当页面<700时是黑色，[700,900]之间时是绿色，>900是红色因为max-width 是小于或等于的关系，就需要小的放后面，否则会发生覆盖下面的这张图实现当页面<700时是黑色，[700,900]之间时是绿色，>900是红色上面CSS中用到 靠后优先 的原则FR:海涛高软（QQ技术交流群：38647原创 2016-09-22 17:06:18 · 380 阅读 · 0 评论