css - 随笔分类 - bighappy

一行或者多行垂直居中问题

摘要：在实际开发中，我们会遇到很多需要多行垂直居中的问题，今天空闲做个总结。 1.首先一行问题我就不用说了，给一个line-height一般都能够解决垂直居中的问题。但是如果是下面这中格式那该如何处理呢？方法二这个方法就是万能的了。代码就不上了。讲一下思路吧首先还是给最大的盒子display：tab 阅读全文

posted @ 2017-08-22 22:01 bighappy 阅读(201) 评论(0) 推荐(0)

css3 手风琴

摘要：1、看了网上很多关于css的手风琴案例，但是都没有讲到相关的原理。主要原理1. 利用target属性。2.锚点链接。 <!doctype html><html><head><meta charset="utf-8"><title>手风琴</title><style>*{transition:all 阅读全文

posted @ 2017-07-09 23:23 bighappy 阅读(498) 评论(0) 推荐(0)

浏览器报错（-）

摘要：Uncaught SyntaxError: Unexpected token < 浏览器出现这个问题，项目在做一些延迟加载的时候，出来这个问题，我百度了产生问题的原因。我先说下，我是如何解决问题的，我在回退版本后发现，是由于重复引入了一个lazyload.js 文件导致的。在百度中我发现，是由于阅读全文

posted @ 2017-06-16 14:07 bighappy 阅读(152) 评论(0) 推荐(0)

关于ajax返回数据处理

摘要：查看jquery文档，我们知道jquery有很多种Ajax调用方法，下面结合springmvc返回的数据，假设返回的是data ='{"label":"1","value":[{"id":1,"pid":null,"name":"娱乐"},{"id":101,"pid":1,"name":"音乐"} 阅读全文

posted @ 2017-06-14 13:50 bighappy 阅读(1571) 评论(0) 推荐(0)

遍历的一些方法，

摘要：最近在做项目是模拟ajax获取数据。原先是的目录结构发生变化。导致首页的nav跳转发生一些问题。如果使用同一个链接肯定是没有办法实现的，项目的其他的页面都是同一个页面。本着少数服从多数的原则。使用js做一些nav跳转调整这个时候我们需要对我们返回回来的数据做一写筛选。突然发现这个东西很多。想着就整阅读全文

posted @ 2017-06-10 17:41 bighappy 阅读(197) 评论(0) 推荐(0)

让内容没有透明度。

摘要：最近在做密码页面的时候，需要给背景一个透明度，而内容没有透明度。取值说明 R：红色值。正整数 | 百分数G：绿色值。正整数 | 百分数B：蓝色值。正整数 | 百分数A：Alpha透明度。取值0~1之间。正整数为十进制0~255之间的任意值，百分数为0%~100%之间的任意值。 RGBA是在R（Re 阅读全文

posted @ 2017-06-06 16:38 bighappy 阅读(182) 评论(0) 推荐(0)

input光标大小

摘要：最近在做项目忘记密码页面时，input光标大小需要统一。同时也需要兼容ie8浏览器。总结如下： IE：不管该行有没有文字，光标高度与font-size一致。 FF：该行有文字时，光标高度与font-size一致。该行无文字时，光标高度与input的height一致。 Chrome：该行无文字时，光阅读全文

posted @ 2017-06-03 16:08 bighappy 阅读(936) 评论(0) 推荐(0)

css中块级元素、内联元素（行内元素、内嵌元素）

摘要：Block element 块级元素顾名思义就是以块显示的元素，高度宽度都是可以设置的。比如我们常用的<div>、<p>、<ul>默认状态下都是属于块级元素。块级元素比较霸道，默认状态下每次都占据一整个行，后面的内容也必须再新起一行显示。当然非块级元素也可以通过css的display:bloc 阅读全文

posted @ 2017-02-28 19:33 bighappy 阅读(1098) 评论(0) 推荐(0)

使用js实现登录随机验证码的效果

摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"><title>js验证码</title><style type="text/css">.code { background:url(code_bg.jpg); font-famil 阅读全文

posted @ 2017-02-27 23:08 bighappy 阅读(518) 评论(0) 推荐(0)

css中选项卡的实现

摘要：制作一个简单的选项卡，以供初学者参考；关于css书写的比较粗糙。请见谅 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>选项卡</title> <style> *{margin:0;padding:0;} a{t 阅读全文

posted @ 2017-02-22 22:21 bighappy 阅读(2351) 评论(0) 推荐(0)

css中书写小三角

摘要：我们在开发过程中，有很多的方向标签不是图片，而是用css方法书写上去的。首先我们要了解原理，border的边框的脚步是45度角。向左方向： width：0px； height：0px； border-top：4px solid transparent； border-right：4px soli 阅读全文

posted @ 2017-02-21 16:59 bighappy 阅读(190) 评论(0) 推荐(1)

关于在搜索栏的一些小bug

摘要：问题：我们在使用input标签和button按钮写搜索框的时候，书写在两行的时候会有缝隙，其次，input标签如果用大的div括起来，里面依然会显示边框。解决方法：1.关于input标签，我们将属性outline：none，就可以实现了。 2.产生缝隙的原因是我们将input和button写在了两阅读全文

posted @ 2017-02-21 16:48 bighappy 阅读(253) 评论(0) 推荐(0)

css控制图片与文字对齐

摘要：文字旁边搭配图片时，发现图片比文字靠上，原来默认的情况是图片顶对齐而文字底对齐，通过设置css属性可以使得图片与文字对齐。设置各对象的vertical-align属性，属性说明：baseline－将支持valign特性的对象的内容与基线对齐sub－垂直对齐文本的下标super－垂直对齐文本的上标t 阅读全文

posted @ 2017-02-19 20:05 bighappy 阅读(2828) 评论(0) 推荐(0)

如果解决图片加载时缝隙问题

摘要：1.首先我们要了解到图片为什么会出现缝隙。是由于默认的对齐方式为：vertical-align：middle； 2.我们加载多张图片时，会产生缝隙。解决方法1：给图片设置对齐方式为：vertical-align：bottom；解决方法2：图片中间有缝隙会是margin产生的，我们可以设置ma 阅读全文

posted @ 2017-02-19 20:01 bighappy 阅读(221) 评论(0) 推荐(0)

随笔分类 - css