css3 - How to create a speech bubble in css? -

-

मैं इस तरह एक भाषण बनाना चाहता हूं,

मैं सीएसएस का उपयोग करने की कोशिश करता हूं। लेकिन मैं इस तरह शीर्ष तीर को संरेखित नहीं कर सकता। मेरा कोड है, 

  .bubble {स्थिति: रिश्तेदार; चौड़ाई: 275 पीएक्स; ऊंचाई: 40px; पैडिंग: 5 पीएक्स; पृष्ठभूमि: # C00006; -विबिट-सीमा-त्रिज्या: 14px; -मोझ-सीमा-त्रिज्या: 14px; सीमा-त्रिज्या: 14px; } .bubble: after {सामग्री: ''; स्थिति: पूर्ण; सीमा-शैली: ठोस; सीमा चौड़ाई: 0 19px 79px; सीमा रंग: # C00006 पारदर्शी; प्रदर्शन क्षेत्र; चौड़ाई: 0; Z- सूचकांक: 1; मार्जिन-बाएं: -19 पिक्सेल; शीर्ष: -79 पीएक्स; बाएं: 69%; }  
  & lt; br & gt; & lt; br & gt; & lt; br & gt; & lt; br & gt; & Lt; div class = "bubble" & gt; & lt; / div & gt;

(पर JSFiddle) ।

आप इसे निम्नानुसार उपयोग और निर्दिष्ट करके प्राप्त कर सकते हैं: 

  .bubble {स्थिति: रिश्तेदार; शीर्ष: 4.8em; चौड़ाई: 275 पीएक्स; ऊंचाई: 40px; पैडिंग: 5 पीएक्स; पृष्ठभूमि: # C00006; -विबिट-सीमा-त्रिज्या: 14px; -मोझ-सीमा-त्रिज्या: 14px; सीमा-त्रिज्या: 14px; } .bubble: after {सामग्री: ''; स्थिति: पूर्ण; सीमा-शैली: ठोस; सीमा चौड़ाई: 0 19px 79px; सीमा रंग: # C00006 पारदर्शी; प्रदर्शन क्षेत्र; चौड़ाई: 0; Z- सूचकांक: 1; / * शीर्ष: -79 पीएक्स; * / नीचे: 100%; / * शीर्ष * / सही निर्दिष्ट करने से बेहतर: 38px; / * तीर की चौड़ाई के बराबर, उदाहरण के लिए * / -webkit-transform: skewX (-45deg); -मोज़-ट्रांसमेंस: स्काईएक्स (-45 डिग्री); -एमएमएस-ट्रांसमेंस: स्क्वैक्स (-45 डिग्री); -ओ-परिणत: स्क्वैक्स (-45 डिग्री); परिणत: स्क्वैक्स (-45 डिग्री); -वेबकिट-परिवर्तन-मूल: 38px 100%; -मोज-ट्रांसफॉर्म-मूल: 38px 100%; -एमएमएस-ट्रांसफॉर्म-मूल: 38px 100%; -ओ-परिवर्तन-मूल: 38px 100%; परिवर्तन-मूल: 38px 100%; }  
  & lt; div class = "bubble" & gt; & lt; / div & gt;  <

यह ध्यान देने योग्य है कि सीएसएस रूपांतरण और नया।


Comments

Post a Comment

Popular posts from this blog

java - Can't add JTree to JPanel of a JInternalFrame -

-
Image
There are two panels in my JInternalframe. I want to add TopPanel to Jtree to nominate another. But I can not add Jaitari to the top of the panel. Please help me in this piece of code: DefaultMutableTreeNode root = new DefaultMutableTreeNode ("deck"); DefaultMutableTreeNode Item Clubs = New DefaultMutableTreeNode ("Club"); AddAllCard (itemClubs); Root.add (itemClubs); DefaultMutableTreeNode item = New DefaultMutableTreeNode ("Diamonds"); AddAllCard (itemDiamonds); Root.add (itemDiamonds); DefaultMutableTreeNode Itemspads = New DefaultMutableTreeNode ("Spades"); AddAllCard (itemSpades); Root.add (itemSpades); DefaultMutableTreeNode item increases = new DefaultMutableTreeNode ("heart"); AddAllCard (itemHearts); Root.add (itemHearts); Default Trimodel Tree Model = New DefaultTreeModel (Route); Tree = new jetty (tree modal); ScrollPane = new JScrollPane (tree); // scrollPane.setViewportView (tree); . ScrollPane.getViewport () add (tr...
Read more

asp.net mvc - How to attach sql database to a javascript graph -

-
I am creating a website using asp mvc5 and I need to show some data on a view using the graph I have implemented a graph using javascript. & lt; Head & gt; & Lt; Script src = "../../ js / jquery-1.11.1.min.js" & gt; & Lt; / Script & gt; & Lt; Script src = "../../JS/chart.cript.js" & gt; & Lt; / Script & gt; @ * & Lt; Link rel = "stylesheet" href = "../../ css / last stylesheet css" & gt; * @ & Lt; / Head & gt; & Lt; Body & gt; & Lt; Div class = "col-md-12" & gt; & Lt; Div class = "panel-panel-default" & gt; & Lt; Div class = "panel-title" & gt; Daily booking & lt; / Div & gt; @ * & Lt; Div class = "panel-body" & gt; * @ @ * & Lt; Div class = "col-lg-2" & gt; & Lt; / Div & gt; & Lt; Div class = "col-lg-8" style = "background-color: # 4876FF;" & G...
Read more

c# - How to know the number of Threads created and limit the Tasks accordingly -

-
It is very clear that with task as async / await Instead of calling the asynchronous call threads , my question is: Is there a way to monitor threads while completing these tasks? This is because I can decide an optimal number of times for the thread that the thread does not eat too many CPU cycles at the same time (the CPU is intensive to handle the work). We take an example below (output is also mentioned) Although the program is completed in 5 seconds, but it has two threads (id = 1,4 ) if I increase the number of 6 instead of 2, then it creates 4 threads I know that this is the CLR thread OS thread (which is 4 in my machine Are), but I would like to know how they are mapped O (with actions) and use the same CPU. Is there any way to get it? Test code Fixed zero main (string [] args) {RunTasksWithDelays (). ); } Static async Task Run Task with Dislay () {Stopwatch S = Stopwatch. Startup (); Console.light line ("thread id =" + thread.content.trade.manag...
Read more