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