语法： text-indent : length 参数： length : 百分比数字|由浮点数字和单位标识符组成的长度值，允许为负值。请参阅长度单位 说明： 检索或设置对象中的文本的缩进。在被另一个对象（如）断开的对象内不能应用本属性。 对应的脚本特性为textIndent。请参阅我编写的其他书目。 示例： div { text-indent : -5px; } div { text-indent : underline 10%; }css中text-indent 怎么用text-indent 表示文本首行缩进,好比word中的...
文章来源：小青年原创 发布时间：2016-05-19 关键词：mui,html5+,webview 转载需标注本文原始地址: http://zhaomenghuan.github.io/#!/blog/20160519 写在前面 本系列文章我们将利用mui基于网易云音乐API实现一个音乐播放器APP，同时基于环形或者融云实现聊天功能。作为本系列文章的第一篇，本文会详细讲解html5+中管理应用窗口界面的Webview模块的用法，因为是初级教程篇不过多讲解原理部分...
CSS如何去掉html img图片边框你好，如果你的网页图片很多，要想都去掉边框，在css中统一写一行代码就可以了。<style> img{border:0;} </style>如果想单独去掉某1个img图片的边框，也可以单独定义。比如<div class="pic"><img src="图片地址" <a href="www.baidu.com/s?wd=alt&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1Y1uyN9ujNBn1NWm19Wnyc30ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bm...
line-height、font-size、vertical-align是设置行内元素布局的关键属性。这三个属性是相互依赖的关系，改变行间距离、设置垂直对齐等都需要它们的通力合作。在CSS字体里面已经详细介绍了font-size的相关内容，本文将主要介绍line-height与vertical-align。line-height定义 line-height行高是指文本行基线之间的距离。行高line-height实际上只影响行内元素和其他行内内容，而不会直接影响块级元素，也可以为一个块级元素设置line...
我们在使用float设定浮动元素的时候经常会遇到撑破p的情况,其中一种解决方法即是利用overflow: hidden,这里我们就来看一下使用CSS的overflow属性防止float撑开p的方法:许多应征前端工程师的人，在面试时都会被问到这类float的问题。例如：p元素内的两个子元素p都float:left，外面的p会变成没有高度，此时该怎么办呢？通常解法是在排版流里面的元素加一个after的伪元素，将它设成display: block以及clear:both即可解决。p:after {co...
今天学习了vue过渡和animate.css结合使用，所以，添加一点小笔记。<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>动画</title><script type="text/javascript" src="vue.js"></script><link rel="stylesheet" type="text/css" href="animate.css" rel="external nofollow" ><style type="text/css">p {width: 300px;height: 300px;background: red;margin: 10px auto;}</style><script type="text/javascr...
我们都知道，word-wrap 属性是CSS3的新属性，那么这篇文章就给大家详细讲解一下word-wrap属性怎么使用，以及使用的注意事项，下面来看一个小列子。1、定义word-wrap 属性允许长单词或 URL 地址换行到下一行。2、语法和参数word-wrap：normal（默认）|break-word normal：允许内容顶开指定的容器边界，如果单词超长，会冲出边界（在当前行显示，不会换行）。 break-word： 内容将在边界内换行，当单词在当前行放不下时，会自动切换到...
HTML5/CSS3 诱人的实例 -模仿优酷视频截图功能的详解：一般的视频网站对于用户上传的视频，在用户上传完成后，可以对播放的视频进行截图，然后作为视频的展示图。项目中也可以引入这样的功能给用户一种不错的体验，而不是让用户额外上传一张展示图。效果图：看起来还是很不错，下面我给大家分析下，极其核心代码很简单：_canvas = document.createElement("canvas"); _ctx = _canvas.getContext("2d"); _ctx.fillStyle = #ffffff; ...
简要教程 这是一组使用CSS3 animation制作的鼠标滑过按钮动画特效。这组鼠标滑过按钮动画共有13最后效果，均由按钮的伪元素和CSS3 animation来制作完成。 查看演示 下载插件 使用方法 HTML结构 该效果通过超链接来制作按钮，例如第一种Swipe效果的HTML代码为：<a class="btn-0" href="#">Swipe</a> CSS样式 为了方便，特效中为除了<i>、<em>、<b>、<strong>和<span>之外的所有元素都添加了动画过渡效果。h...
本篇文章给大家带来的内容是css伪类之nth-child()示例详解，让大家了解nth-child()伪类可以做什么。有一定的参考价值，有需要的朋友可以参考一下，希望对你们有所帮助。在CSS3中nth-child()伪类对于在HTML中创建格式化的Excel样式表非常有用。也用于生成网格布局而不必求助于表格。首先我们来了解一下nth-child()伪类的相关知识。【相关视频教程推荐：css教程，css3教程！】nth-child()伪类的基本规则：我们使用的语法是 ：nth-ch...
CSS3中nth-child与nth-of-type的区别其实很简单：:nth-of-type为什么要叫:nth-of-type？因为它是以"type"来区分的。也就是说：ele:nth-of-type(n)是指父元素下第n个ele元素， 而ele:nth-child(n)是指父元素下第n个元素且这个元素为ele，若不是，则选择失败。文字未免听起来比较晦涩，便于理解，这里附上一个小例子：<!DOCTYPE html> <htmllang="en"> <head> <metacharset="UTF-8"> <title>demo</title> </head> <style> .demo li:...
本篇文章给大家带来的内容是css3径向渐变详解之精确定义渐变的形状大小、添加多种终止颜色。有一定的参考价值，有需要的朋友可以参考一下，希望对你们有所帮助。定义明确的形状和大小在之前的文章【详解css3径向渐变如何定义中心和大小形状】中我们介绍定义渐变中心、使用关键字定义渐变形状与大小的方法，大家可以参考一下。但，有时我们需要更加精准的定义一个径向渐变的大小与形状，这就需要使用长度值或或百分比值来实现了。如...
最近要模仿一个页面，其中有一个效果就是 三 菜单栏 变形为 X 的效果，效果如下：图（1）初始效果图（2）鼠标悬浮效果思路：三横的实现：传统可以用3个span标签来实现，但有一个更加巧妙的方法，1个标签就能实现三横效果，根据张鑫旭大神分享的利用padding用一个标签实现 三 的效果，大概原理是上中下横线分别用 border-top，背景，border-bottom。用background-clip：content-box剪裁，最后用padding上下撑开，实现三横的视觉效果...
什么是伪元素伪元素表示了某个元素的子元素。这个子元素虽然在逻辑上存在，但却并不实际存在于文档树中。因为伪元素并不在文档树中，所以通过JS，也抓取不到伪元素，也不能给它绑事件。语法伪元素以::开头。在CSS1和CSS2中，伪元素和伪类一样，都是用:开头。但在CSS3中，伪元素以::开头，用以和伪类进行区分。IE8不支持::。因此如果要兼容IE8，只能用:。常见的伪元素::before在当前元素的内容的前面插入一个子元素。插入的元素为内...
利用@media screen实现网页布局的自适应优点:无需插件和手机主题,对移动设备友好,能够适应各种窗口大小。只需在CSS中添加@media screen属性,根据浏览器宽度判断并输出不同的长宽值1280分辨率以上（大于1200px）@media screen and (min-width:1200px){#page{ width: 1100px; }#content,.div1{width: 730px;}#secondary{width:310px} } 1100分辨率（大于960px，小于1199px）@media screen and (min-width: 960px) and (max-width: 11...