1. 如何用 html+css 实现平行四边形，以及气泡

transform:skewX(30deg)

扭曲skew()函数能够让元素倾斜显示。它可以将一个对象以其中心位置围绕着X轴和Y轴按照一定的角度倾斜。这与rotate()函数的旋转不同，rotate()函数只是旋转，而不会改变

元素的形状。skew()函数不会旋转，而只会改变元素的形状。

  • 一个参数：表示水平方向的倾斜角度；

  • 两个参数：第一个参数表示水平方向的倾斜角度，第二个参数表示垂直方向的倾斜角度

气泡需要两个组合

2. 请教：如何用CSS+div实现气泡弹出框

JS+CSS实现一个气泡弹出框
http://www.jb51.net/article/40673.htm

3. html5 css3 js 动画 点击气泡后 气泡会爆炸

如果要爆炸效果，替换相应图片即可。


参考：http://www.iteye.com/topic/1112322

4. 网页设计中，div 气泡是什么意思

气泡功能我没用过，不过这类功能大多是用于一些大站 用用ajax 挺容易的！

http://www.jb51.net/css/40172.html

你可以内参考一下容这里

5. html css消息气泡怎么写

<divclass="send">
<divclass="arrow"></div>
</div>
<styletype="text/css">
body{
background:#4D4948;
}

.send{
position:relative;
width:150px;
height:35px;
background:#F8C301;
border-radius:5px;/*圆角来源*/
margin:30pxauto0;
}

.send.arrow{
position:absolute;
top:5px;
right:-16px;/*圆角的位置需要细心调试哦*/
width:0;
height:0;
font-size:0;
border:solid8px;
border-color:#4D4948#4D4948#4D4948#F8C301;
}
</style>

6. 气泡注释或弹窗式注释能用div+css或HTML实现吗

恐怕要加上JS或是JQ的力量才行啊，光html+css也可以实现但是不科学啊

7. 气泡漂浮上来停止，然后左右摇摆不停css3怎么写

<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8">
<title></title>
<style>
*{padding:0;margin:0;font-size:14px;}
	body{
		background:grey;
	}
	.d{
		position:fixed;margin:auto;left:0;right:0;bottom:24px;width:160px;height:120px;
		animation:d13slinear;animation-fill-mode:both;
	}
	@keyframesd1{
		from{
			bottom:24px;
		}
		to{
			bottom:360px;
		}
	}
	.dimg{
		height:120px;position:absolute;margin:auto;left:0;top:0;animation:d22s3slinearinfinite;animation-fill-mode:both;
	}
	@keyframesd2{
		0%,100%{
			transform:rotate(0deg);
		}
		50%{
			left:40px;
			transform:rotate(90deg);
		}
	}
</style>
</head>
<body>
	<divclass="d">
		<imgsrc="http://aimusic.image.alimmdn.com/Image/.png"/>
	</div>
</body>
</html>

8. iview 气泡提示怎么传html

:class="[prefixCls + '-rel']"
v-el:reference
@click="handleClick"
- @mousedown="handleFocus"
- @mouseup="handleBlur">
+ @mousedown="handleFocus(false)"
+ @mouseup="handleBlur(false)">
<slot></slot>
</div>
<div :class="[prefixCls + '-popper']" :style="styles" transition="fade" v-el:popper v-show="visible">
@@ -91,7 +91,8 @@
data () {
return {
prefixCls: prefixCls,
- showTitle: true
+ showTitle: true,
+ isInput: false
};
},
computed: {
@@ -133,14 +134,14 @@
}
this.visible = false;
},
- handleFocus () {
- if (this.trigger !== 'focus' || this.confirm) {
+ handleFocus (fromInput = true) {
+ if (this.trigger !== 'focus' || this.confirm || (this.isInput && !fromInput)) {
return false;
}
this.visible = true;
},
- handleBlur () {
- if (this.trigger !== 'focus' || this.confirm) {
+ handleBlur (fromInput = true) {
+ if (this.trigger !== 'focus' || this.confirm || (this.isInput && !fromInput)) {
return false;
}
this.visible = false;
@@ -164,12 +165,41 @@
ok () {
this.visible = false;
this.$emit('on-ok');
+ },
+ getInputChildren () {
+ const $input = this.$els.reference.querySelectorAll('input');
+ const $textarea = this.$els.reference.querySelectorAll('textarea');
+ let $children = null;
+
+ if ($input.length) {
+ $children = $input[0];
+ } else if ($textarea.length) {
+ $children = $textarea[0];
+ }
+
+ return $children;
}
},
- ready () {
+ compiled () {
if (!this.confirm) {
this.showTitle = this.$els.title.innerHTML != `<div class="${prefixCls}-title-inner"></div>`;
}
+ // if trigger and children is input or textarea,listen focus & blur event
+ if (this.trigger === 'focus') {
+ const $children = this.getInputChildren();
+ if ($children) {
+ $children.addEventListener('focus', this.handleFocus, false);
+ $children.addEventListener('blur', this.handleBlur, false);
+ this.isInput = true;
+ }
+ }
+ },
+ beforeDestroy () {
+ const $children = this.getInputChildren();
+ if ($children) {
+ $children.removeEventListener('focus', this.handleFocus, false);
+ $children.removeEventListener('blur', this.handleBlur, false);
+ }
}
};
</script>

9. html5 气泡框怎么随着文字增加而变化

气泡不要设置宽高，设置一个属性overflow：hidden 防止坍塌
--深圳远标

10. CSS3气泡对话框

sadfsdafsadf