随笔分类 - H5+CSS3

分享关于H5与CSS3的知识
摘要:昨天群里有人问个问题:为什么button加了文字后,产生了对齐不一致的问题。 原因在于baseline的对齐问题。 然后就有人推荐了一篇文章:关于Vertical-Align你需要知道的事情 其中里面最后一个例子讲到了如何解决inline元素换行的问题。 里面说用注释可以解决换行问题,我测试了下发现 阅读全文
posted @ 2018-05-18 13:21 汕大小吴 阅读(3926) 评论(2) 推荐(0) 编辑
摘要:本文篇幅较长,希望能坚持看完,转载请注明出处,如果觉得好文请给个赞吧 CSS实现梯形 CSS实现三角形和梯形主要是依靠border是梯形的特性来做的,有点像相框的那种感觉。 首先我们先给一个正方形设置比较宽的边框。如下。 <div id="test1"></div> <style> #test1{ 阅读全文
posted @ 2018-03-31 13:03 汕大小吴 阅读(8152) 评论(0) 推荐(1) 编辑
摘要:转载自知乎:https://zhuanlan.zhihu.com/p/25321647 一、常见定位方案 在讲 BFC 之前,我们先来了解一下常见的定位方案,定位方案是控制元素的布局,有三种常见方案: 1.普通流 在普通流中,元素按照其在 HTML 中的先后位置至上而下布局,在这个过程中,行内元素水 阅读全文
posted @ 2018-03-14 14:15 汕大小吴 阅读(380) 评论(0) 推荐(0) 编辑
摘要:本文转自:http://www.cnblogs.com/wuyinghong/p/3633213.html<canvas class="cvs"></canvas>遇到的问题:如css 中设.cvs{width:500px;height:400px;},也就是css改变了canvas的尺寸后,本来是 阅读全文
posted @ 2017-05-11 14:47 汕大小吴 阅读(2921) 评论(0) 推荐(1) 编辑
摘要:问题简述: 今天帮一个师姐做网页遇到一个这样的要求: 鼠标不移动进表格,表格透明度不变。 鼠标移动进表格,hover到的单元格透明度不变,没hover到的单元格透明度改变。 先贴我已经实现好的效果,一开始,表格透明度不变。 当我鼠标移动到第二排第三个单元格,其他单元格降低透明度。 解决办法 一开始, 阅读全文
posted @ 2017-05-08 02:19 汕大小吴 阅读(6001) 评论(7) 推荐(1) 编辑
摘要:新版本 新版本的flex布局模型是2012年9月提出的工作草案,这个草案是由W3C推出的最新语法,这个版本立志于指定标准,让新式的浏览器全面兼容,在未来的浏览器更新换代中实现统一。 目前几乎大部分的浏览器都支持了。浏览器支持情况可以点击这里查看,下图为支持flex的情况 属性详解 首先和之前一样,先 阅读全文
posted @ 2017-04-30 18:58 汕大小吴 阅读(886) 评论(2) 推荐(1) 编辑
摘要:混合过渡版 上一篇我们主要讲了旧版box布局,今天这篇主要讲flexbox布局。 混合版本的Flexbox模型是2011年提出的工作草案,主要是针对IE10浏览器实现的伸缩布局效果,其功能和旧版本的功能大同小异。 在这里我们还是采用上一篇的文件,使用混合过渡代码实现IE10的伸缩布局。 首先,我们要 阅读全文
posted @ 2017-04-30 17:16 汕大小吴 阅读(417) 评论(0) 推荐(0) 编辑
摘要:布局简介 CSS3提供了一种崭新的布局方式:Flexbox布局,即弹性伸缩布局模型(Flexible Box)用来提供一个更加有效的方式实现响应式布局。 由于这种布局还处于W3C的草案阶段,并且它分为旧版本、新版本、混合过渡版本三种不同的编码方式。浏览器的兼容性存在一定的问题 首先,我们来看看旧版本 阅读全文
posted @ 2017-04-30 06:14 汕大小吴 阅读(904) 评论(0) 推荐(0) 编辑
摘要:主要工作 这个由于年代已久,觉得代码很乱已经删除了代码 JS主要为计时器以及问卷的相关业务处理 部分效果图: 部分代码: 计时器: 阅读全文
posted @ 2017-04-21 01:09 汕大小吴 阅读(4203) 评论(2) 推荐(0) 编辑
摘要:前端时间做的CSS作业:基于CSS的个人网页 基于CSS的个人网页 效果图: 代码: 阅读全文
posted @ 2017-04-21 00:37 汕大小吴 阅读(2292) 评论(3) 推荐(2) 编辑
摘要:table标签构造课表 table标签常用于制作表格以及简单布局,于是我就玩了下table标签,用table标签也能构造出很漂亮的页面呢,虽然在博客页面加入与实际打开页面稍微有点出入,但还是可以接受的。 代码如下: 代码效果: 我的课表 阅读全文
posted @ 2017-04-18 17:12 汕大小吴 阅读(3326) 评论(1) 推荐(2) 编辑
摘要:注意项 我们知道,如果想要两个 div(即块级元素)挨着一起排列,可以将其设置为inline-block(行内-块元素)。 不过要注意两个div内的内容的对齐方式将是垂直中间对齐,所以这时候就需要使用float浮动。 使用float的时候有个问题:当一个元素盒子被浮动后,下面的元素会自动堆叠处理,导 阅读全文
posted @ 2017-04-03 02:41 汕大小吴 阅读(294) 评论(0) 推荐(0) 编辑