当最外面的层想要设置一个 overflow: hidden，但子元素又想他们能滚动，像今日头条的滚动导航一样：html：<div id="wrapper"><ul id="scroll"><li>cell 1</li><li>cell 2</li><li>cell 3</li><li>cell 4</li><li>cell 5</li><li>cell 6</li><li>cell 7</li><li>cell 8</li><li>cell 9</li><li>cell 10</li><li>cell 11</li><li>cell 12</li><li>cell 13</li><li>cell 14</li> </ul></div>css：#wrapper{width: 100%;height: 60px;...
document.querySelector(‘div‘).addEventListener(‘transitionEnd‘,function(){console.log(‘过度结束‘)})如果要兼容低版本的浏览器，就添加浏览器的内核前缀 webkitTransitionEnd / mozTransitionEnd / oTransitionEnd.... 清除表单下拉框的默认样式 主要是在移动端的默认样式select::-ms-expand{display:none;} select{appearance:none;-moz-appearance:none;-webkit-appearance:none; } 修改表单元素 placeholder ...
1、HTML 元素透明 其实本身，CSS 实现元素透明是件容易事儿。直接上代码：?1opacity:.5opacity 指的是不透明度，取值为 0~1 之间，1 表示完全不透明，0 表示完全透明。A 级浏览器基本都支持 opacity 属性，但碰上 IE，总没好事。不过 IE 有滤镜，可以帮助我们拐弯抹角地搞定不透明度：?1filter:alpha(opacity=50);注：事实上会碰到透明背景层，而 opacity 属性是会继承的，避免这个问题，需要结合定位来实现。在 CSS3 中，...
JavaScript获取DOM节点HTML元素CSS样式技术maybe yes 发表于2015-01-10 18:07原文链接 : http://blog.lmlphp.com/archives/59 来自 : LMLPHP后院如何使用 JavaScript 获取某个 DOM 节点下 HTML 元素的 CSS 样式值？使用过 JQuery 的童鞋一定都非常的熟悉，Jquery 提供了非常强大的 CSS 方法，可以很方便的设置和获取元素的 style 属性。某些情况下，我们不能使用 JQuery 时，就必须使用纯 JavaScript 获取元素的 style 属性值。本...
元素的显示与隐藏类似网站广告，当我们点关闭就不见了，但是我们重新刷新页面，会重新出现！本质：让一个元素在页面中隐藏或者显示出来。有如下三种方式：display 显示隐藏visibility 显示隐藏overflow 溢出显示隐藏1. display 显示隐藏元素display属性用于设置一个元素应如何显示。display: none; 隐藏对象display: block; 除了转换为块级元素之外，同时还有显示元素的意思display 隐藏元素后，不再占有原来的位置。后面应用及其...
元素选择器最常见的 CSS 选择器是元素选择器。换句话说，文档的元素就是最基本的选择器：p { text-indent:10px; color:blue; } 什么情况下使用元素选择器，一般我们这样认为： 如果你想要让页面中所有的指定元素都有这个CSS效果，可以使用元素选择器。 有这样一段html代码：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><link rel="stylesheet" type="text/css" href="index.css"><title></title></head><bo...
×目录[1]动态样式[2]CSS类[3]setAttribute()[4]CSSRule对象添加[5]空样式覆盖[6]CSSRule对象删除前面的话 我们可以通过计算样式来读取伪元素的样式信息，但是却无法使用javascript来直接操作伪元素，本文以一个需求解决为例，详细介绍脚本化伪元素的6种方法需求说明 【1】为id=box的div元素添加content="前缀"的:before伪元素 【2】为已经添加:before伪元素的div元素删除伪元素 [注意]由于IE7-浏览器不支持:before伪元...
下面我们来了解一下css选择器里面的几个:only-childp:only-child选择属于其父元素的唯一子元素的每个 <p> 元素。3:nth-child(n)p:nth-child(2)选择属于其父元素的第二个子元素的每个 <p> 元素。3:nth-last-child(n)p:nth-last-child(2)同上，从最后一个子元素开始计数。3:nth-of-type(n)p:nth-of-type(2)选择属于其父元素第二个 <p> 元素的每个 <p> 元素。3:nth-last-of-type(n)p:nth-last-of-type(2)同上，但是从最后一个子元素开...
转自https://www.w3school.com.cn/html/html_css.aspHTML CSS HTML 注释HTML 链接通过使用 HTML4.0，所有的格式化代码均可移出 HTML 文档，然后移入一个独立的样式表。 实例 HTML中的样式本例演示如何使用添加到 <head> 部分的样式信息对 HTML 进行格式化。没有下划线的链接本例演示如何使用样式属性做一个没有下划线的链接。链接到一个外部样式表本例演示如何 <link> 标签链接到一个外部样式表。如何使用样式 当浏览器读到一个样式...
1.hr元素在网页当中地位 一个好的网页设计在运用水平线是必不可少的2.在网页中水平的显示长短是由（属性width和hight来控制） 而定位呢？ hr元素提供了text-align的属性但是在网页中没有相应的效果，但是可以用margins属性来实现 在网页中的定位 本文出自 “每一次的总结会有新的感悟” 博客，谢绝转载！原文：http://7021401.blog.51cto.com/7011401/1394779
项目的需要，需要一个背景半透明的效果，于是马上想到“opacity:0.5″等等，为兼容IE可能还会用到filter,如:filter:alpha(opacity=50);-moz-opacity:0.50;opacity:0.50;上面的是可以达到半透明的效果，但是会影响里面的子元素也半透明，例如DIV里面的文字也半透明了，这不是我想要的如下，实现了可以兼容各浏览器，达到背景颜色半透明而不影响子元素的代码：background:rgba(0,0,0,0.6)background: transparent\9;zoom:1\8;/* requ...
伪类选择器，和一般的DOM中的元素样式不一样，它并不改变任何DOM内容。只是插入了一些修饰类的元素，这些元素对于用户来说是可见的，但是对于DOM来说不可见。伪类的效果可以通过添加一个实际的类来达到。a:link|a:visited|a:hover|a:active在 CSS 定义中，a:hover 必须被置于 a:link 和 a:visited 之后，才是有效的，a:active 必须被置于 a:hover 之后，才是有效的。 由于状态是动态变化的，所以一个元素达到一个特定状态时，它可...
有dom结构visibility: visible; //显示visibility: hidden; //隐藏没dom结构display: block; //显示display: none; //隐藏 原文：https://www.cnblogs.com/Hajar/p/11088496.html
取消“display:inline-block 相邻元素间有4px的空白间距”Demo：http://jsfiddle.net/JSDavi/p6gcx6nx/例子：<div sytle="display:inline-block; width:25%;background-color:blue;">aaaaaa</div><div sytle="display:inline-block; width:50%;background-color:red;">bbbbbb</div><div sytle="display:inline-block; width:25%;background-color:green;">ccccccc</div>解决方案：清除（inline-block）元素“</div>”和“<div>”的...
目录：html5+css3网页设计与制作目录1.子元素选择器>，用来选中某个元素的第一级子元素，也就是儿子元素<!DOCTYPE html><html><head><meta charset="utf-8"><title></title><style type="text/css">/* 子代选择器,只对儿子元素有效 */p>strong{color: red;}</style></head><body><p>这是p标签，<strong>表示一个段落</strong></p><p>这是p标签，嵌套了<i>b标签和<strong>i标签</strong></p></body></html>2.兄弟选择器+，两个元素有...