css - 随笔分类(第2页) - 刘世涛6192

摘要：div: img: 阅读全文

posted @ 2018-04-20 08:36 刘世涛6192 阅读(123) 评论(0) 推荐(0)

摘要：首先上图，这两张很明显可以看出IE盒模型和标准盒模型之间的差别。当然今天不是去细细追究两种模型具体是怎么去计算布局的，那个很多文章已经已经有过了，不再重复。以前刚开始学习盒模型的时候，就学到的是IE的盒模型不规范，不符合标准的盒模型，要加文档申明把IE的转换为标准的。要给文档头部加上 DOCTYP 阅读全文

posted @ 2018-04-09 16:49 刘世涛6192 阅读(3065) 评论(0) 推荐(0)

移动端bug之解决方式

摘要：1、Android中元素被点击时产生的边框: * { -webkit-tap-highlight-color: rgba(250,250,250,0); /*更改点击事件的焦点色*/} 2、去除移动端输入框内阴影: input,textarea { border: 0; /* 方法1 */ -web 阅读全文

posted @ 2018-03-15 10:11 刘世涛6192 阅读(265) 评论(0) 推荐(0)

CSS实现单行、多行文本溢出显示省略号（…）

摘要：如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来，当然还需要加宽度width属来兼容部分浏览。实现方法：效果如图：但是这个属性只支持单行文本的溢出显示省略号，如果我们要实现多行文本溢出显示省略号呢。接下来重点说一说多行文本溢出显示省略号，如阅读全文

posted @ 2018-01-31 15:46 刘世涛6192 阅读(329) 评论(0) 推荐(0)

css水波动画效果

摘要：代码来源：http://www.jq22.com/code1526 HTML： <div class="waves"></div> css：效果：阅读全文

posted @ 2018-01-30 09:54 刘世涛6192 阅读(645) 评论(0) 推荐(0)

画出倒三角

摘要：css: .header_menu_new-top{width: 0rem;height: 0rem;position: absolute;top: -0.12rem;right: 0.2rem;border-color: rgba(0,0,0,0.8) transparent;border-wid 阅读全文

posted @ 2018-01-29 15:06 刘世涛6192 阅读(251) 评论(0) 推荐(0)

解决ios手机页面overflow scroll滑动很卡的问题

摘要：在移动端html中经常出现横向/纵向滚动的效果,但是在iPhone中滚动速度很慢,感觉不流畅,有种卡卡的感觉,但是在安卓设备上没有这种感觉; 要解决这个问题很简单: 一行代码搞定 -webkit-overflow-scrolling : touch; 阅读全文

posted @ 2018-01-26 16:09 刘世涛6192 阅读(576) 评论(0) 推荐(0)

设置滚动位置

摘要：//返回顶部$('.leftTop').click(function(){ $('body,html').animate({scrollTop:0},500); });到指定位置html: <div class="nav-left"> <ul class="floatC 阅读全文

posted @ 2018-01-24 16:25 刘世涛6192 阅读(176) 评论(0) 推荐(0)

css实现右侧固定宽度，左侧宽度自适应

摘要：反过来也可以：左侧宽度固定，右侧自适应。不管是左是右，反正就是一边宽度固定，一边宽度自适应。这种布局比较常见，博客园很多默认主题就是这种。一般情况下，这种布局中宽度固定的区域是侧边栏，而自适应的区域是主体内容区——相信把侧边栏搞成自适应的人很少吧？要实现这种布局，也算比较简单。我们先给出html 阅读全文

posted @ 2018-01-23 17:01 刘世涛6192 阅读(3428) 评论(0) 推荐(0)

css样式优先级和权重问题

摘要：内联样式： <div style="font-size: 12px;">姓名</div> 外部样式： <link rel="stylesheet" href="css/bootstrap.min.css" /> 内嵌样式： <style> .name{ font-size: 12px;; } </ 阅读全文

posted @ 2018-01-23 11:37 刘世涛6192 阅读(489) 评论(0) 推荐(0)

css布局---各种居中

摘要：居中是我们使用css来布局时常遇到的情况。使用css来进行居中时，有时一个属性就能搞定，有时则需要一定的技巧才能兼容到所有浏览器，本文就居中的一些常用方法做个简单的介绍。注：本文所讲方法除了特别说明外，都是兼容IE6+、谷歌、火狐等主流浏览器的。先来说几种简单的、人畜无害的居中方法 1. 把ma 阅读全文

posted @ 2018-01-23 11:21 刘世涛6192 阅读(181) 评论(0) 推荐(0)

改变父元素的透明度，不影响子元素的透明度—css

摘要：1、如果我们给父元素添加opacity:0.4后，子元素的red颜色也变成了0.4的透明度，例子如下：结果： **解决方法：父元素的透明度用rgba的方法 background:rgba(0,0,0,0.4);** 解决的后的代码：结果：解决方案2：有兼容性问题；利用CSS中的opaci 阅读全文

posted @ 2018-01-09 17:27 刘世涛6192 阅读(4991) 评论(0) 推荐(0)

如何移除 input type="number" 时浏览器自带的上下箭头？

摘要：Chrome 下阅读全文

posted @ 2018-01-08 15:03 刘世涛6192 阅读(533) 评论(0) 推荐(0)

css hover使用条件

摘要：1:必须是其子元素才可以使用；举例： css：阅读全文

posted @ 2018-01-02 16:16 刘世涛6192 阅读(842) 评论(0) 推荐(0)

css浮动的元素居中

摘要：<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>页面浮动元素的水平居中</title> <style type="text/css"> 阅读全文

posted @ 2018-01-02 11:16 刘世涛6192 阅读(583) 评论(0) 推荐(0)

css设置超出部分文档隐藏（在table标签中不好使解决方案在下）

摘要：css设置： .text-over{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;cursor: pointer} div设置：<div title="简约大气经典设计超高性价比 1.8米环保皮艺双人床床超高性价比 1. 阅读全文

posted @ 2017-12-29 17:04 刘世涛6192 阅读(972) 评论(0) 推荐(0)

css样式：宽高按一定比例进行自适应

摘要：纯 CSS 实现高度与宽度成比例的效果最近在做一个产品列表页面，布局如右图所示。页面中有若干个 item，其中每个 item 都向左浮动，并包含在自适应浏览器窗口宽度的父元素中。 item 元素的 CSS 定义如下： .item { float: left; margin: 10px 2%; wi 阅读全文

posted @ 2017-12-20 16:59 刘世涛6192 阅读(14039) 评论(0) 推荐(0)

随笔分类 - css