Home
Search results “Div style text color red”
CSS Tutorial for Beginners - 02 - Changing font type, color, and size
 
04:06
In this video we go over changing the font type, size, and color. Source for episode: http://pastebin.com/RVK07MrM
Views: 414701 EJ Media
How to Change Color, Font, and Size of a Text in HTML
 
03:02
Yo Guys? What's Up? How is your experience with Alphixia? Hope you all are having a good time with us. So In this video you will learn how to change the color, font and size of a Text in HTML. This can be done with the two tags - The font tag and they style tag. But the font tag has been deprecated by the World Wide Consortium (W3Consortium) and has suggested to use the style tag instead. Both ways are explained thoroughly and you will easily understand it. You can learn more such things by checking out our channel for more Tutorials of HTML. You can also ask your doubts and get satisfying answers by our Experts. You can contact us at [email protected] or leave a message. You can also ask your questions on our site www.alphixia.weebly.com I sincerely Thank You for watching this and I hope that Alphixia has helped you. We will keep helping , as we think it is our religion to help people! Thanks! Nick - Co Owner
Views: 257916 Alphixia
HTML video tutorial - 19 - html font tag
 
09:14
HTML font tag: html font tag is used to change the font face, font color and font size. html font tag is a paired tag. font tag has three important attributes: size: used to change the size of the font (min =1 and max =7). color: used to change the color of the text. face: used to change the font style or font face of the text. Fonts can be broadly categorized as: Serif and Sans-Serif Serif fonts: Serif fonts contain extra arms and base at the end of the line strokes. Ex: Times New Roman Sans serif fonts: without serif. Ex: Arial Use serif fonts for heading. Use sans serif fonts for paragraphs. Font family: Arial Font face: Arial black, Arial narrow etc Example Code: <html> <head> <title>HTML attributes</title> </head> <body> Hello <font size="5">HTML!</font> <br/> Hello <font size="5" color="red">HTML!</font> <br/> Hello <font size="5" color="red" face="arial">HTML!</font> <br/> </body> </html> ======================================================== Follow the link for next video: https://youtu.be/FNe2vmUsLiQ Follow the link for previous video: https://youtu.be/MqBB5FX3VXw ========= For more benefits & Be up to date =================== Subscribe to "chidres tech tutorials" channel: it's free Visit to Chidre's Tech Tutorials website: https://www.chidrestechtutorials.com Like the Facebook fan page: https://www.facebook.com/ManjunathChidre ======================================================== ========== HTML Questions & Answers ====================== 1. Which of the following HTML code is valid code? a. colour=’red” b. color=”red’ c. color="red" d. colour="red" Answer: c 2. Which of the following attribute(s) we can use with font tag? a. size b. face c. color d. All of above Answer: d ========================================================
Views: 9882 Chidre'sTechTutorials
Color values (hex, rgba, and color names) - Webflow CSS tutorial
 
03:23
Sometimes, using Webflow's color picker is all you need to choose a color to work with. But if you need precision, you want to get more specific by using a color name, hex code, or RGBA value. In this video, we'll explain all three options and how to use them in Webflow. ---------- Get started with Webflow: https://help.webflow.com/courses/getting-started http://webflow.com http://twitter.com/webflow http://facebook.com/webflow
Views: 12367 Webflow
CSS: How to change background color of a div
 
03:10
You can change the background color of a div using CSS property background-color. Set it to a string like red, organe, blue or a color code like #ff8200. This tutorial talks about doing that.
Views: 6515 WebTecho Tutorials
Auto Text Color with jQuery
 
04:45
Support Donate for me: https://www.patreon.com/codetube Follow me: https://www.facebook.com/mycodetube/ https://plus.google.com/+kautubecodeghazali My Social Media: https://www.facebook.com/tghazalipidie https://www.twitter.com/tghazalipidie Thank you very much for watching my new video on this channel Code Tube. You can contribute to this channel by giving support, make the subtitle, or comments that are supportive.
Views: 286 Code Tube
HTML Introduction: Part 5, Style Tag
 
04:39
Hello and Welcome to another session on HTML series. We have covered quite a lot in past four sessions which you may want to check out. In the earlier sessions, we started from the beginning of, what is HTML, to different tags, and associated attributes to tags in details like, IMG tag and its attributes, for embedding images in HTML document. In this session, we will consider another such attribute common in some tags, that is style attribute. Please note that to have hands on experience, modify the code accordingly. The HTML Style Attribute is for setting different styles of an HTML element. To apply style on supported HTML element, write the HTML element and define the style property as the syntax shown. Syntax - <tagname style="property:value;"> The property defines, what style is to be set for the HTML element. The property is something which is called CSS property or cascading style sheet. CSS is used to define all the style properties of HTML document. The value in style attribute is a CSS value. Let’s learn more about the style attribute, properties and values. HTML Background Color The background-color property defines the background color for an HTML element. The syntax is to define property background color as shown with value as any color Syntax - <tagname style="background-color:value;"> This example sets the background color for a page to powderblue: Example <body style="background-color:powderblue;"> HTML Text Color The color property defines the text color for an HTML element The syntax is to define property color as shown with value as any color Syntax - <tagname style="color:value;"> This example sets the color as blue for the header and paragraph. Example <h1 style="color: blue;">This is a heading</h1> <p style="color: red;">This is a paragraph. </p> HTML Fonts The font-family property defines the font to be used for an HTML element. The syntax is to define property font family as shown with value as any color Syntax - <tagname style="font-family:value;"> This example sets font as verdana and courier. Example <h1 style="font-family:verdana;">This is a heading</h1> <p style="font-family:courier;">This is a paragraph.</p> HTML Text Size The font-size property defines the text size for an HTML element. The syntax is to define property font size as shown with value as any color The syntax is to define property font size as shown with value as size Syntax - <tagname style="font-size:value;"> This example sets the header font size to 3 times and paragraph font size to 160 percent. Example <h1 style="font-size:300%;">This is a heading</h1> <p style="font-size:160%;">This is a paragraph.</p> HTML Text Alignment The text-align property defines the horizontal text alignment for an HTML element. The syntax is to define property text alignment as shown with value as center, left, right Syntax - <tagname style="text-align:value;"> This example sets the text alignment as center. Example <h1 style="text-align:center;">Centered Heading</h1> <p style="text-align:center;">Centered paragraph.</p> Well Done! You have learned to Use the style attribute for styling HTML elements, Use background-color for background color, Use color for text colors, Use font-family for text fonts, Use font-size for text sizes, and Use text-align for text. To find out more, visit links in the description. Which topic you want us to cover next. Share your thoughts in the comment section. Like and subscribe for more videos. Source: https://www.w3schools.com/html/html_styles.asp Code ------------------------------------ <html> <head> <title>HTML Introduction - Part 5 - Style Attribute</title> </head> <body style="background-color:powderblue;"> <h1 style="color:blue;">This heading is in color blue by style tag.</h1> <p style="color:red;">This paragraph is in red color by style tag.</p> <h1 style="font-family:verdana;">This heading's font is verdana</h1> <p style="font-family:courier;">This paragraph font is courier.</p> <h1 style="font-size:300%;">This heading font size is 3 times the normal heading.</h1> <p style="font-size:160%;">This paragraph font size is 1.6 time the normal font size.</p> <h1 style="text-align:center;">This Heading is in center <h1> <p style="text-align:center;">This paragraph is in center.</p> </body> </html> My Blogs https://azblogs4u.blogspot.com/ https://atozcreations4u.wixsite.com/insights PACIFIC SUN by Nicolai Heidlas Music https://soundcloud.com/nicolai-heidlas Creative Commons — Attribution 3.0 Unported— CC BY 3.0 http://creativecommons.org/licenses/b... Music promoted by Audio Library https://youtu.be/kbqmEJTr3nU
Views: 94 LEARNITIUM
CSS Background Image Color Overlay | Color Filter Quick Tutorial
 
03:15
This video is going to show you how to add CSS Background Image Color Overlay or tinted background image. Read the Article: http://www.22bulbjungle.com/background-image-color-overlay-create-a-filter-look-with-css/ Follow Us Facebook: http://bit.ly/2srBAX7 Twitter: http://bit.ly/2tAEvgG Instagram: http://bit.ly/2tbfnKn css background image color overlay , overlay color on image css, css overlay color on image, css filter color overlay, color overlay image css, css color overlay, css filter, overlay color, css image overlay, background image, css background image, css overlay, image overlay, overlay pictures, overlay text on image, tinted image, tinted background image, css tinted image Subscribe to us : https://www.youtube.com/channel/UCaU1VsZaFQ1hHq8P2dGrJMw?sub_confirmation=1 Make a DIV the same Width and Height as Image https://www.youtube.com/watch?v=ksYaUXsJu_Y MARGIN VS PADDING watch here: https://www.youtube.com/watch?v=MwBqer-xRy8 Change CSS Selection Color. watch: https://www.youtube.com/watch?v=Zgj5gKxx6aY Add custom Fonts in CSS: https://www.youtube.com/watch?v=D2bO-_RX7MA CSS Placeholder Color https://www.youtube.com/watch?v=HHhC67Gtalo How to disable someone from copying texts in your website: https://www.youtube.com/watch?v=a2MS1jd9M_w How to properly add background image with CSS: https://www.youtube.com/watch?v=dfqR3sEnj6k How to center a div inside a div: https://www.youtube.com/watch?v=RCoQOS4s5ls How to create unordered list without bullets: https://www.youtube.com/watch?v=_KXobsfRlPQ
Views: 33562 garnatti one
Basic HTML: Learning Web Colors by Building an HTML Color Wheel
 
44:04
Hi! I am Sam Galope! Welcome back to my channel. In this lesson, we will use everything we have learned from lesson 1 to 4 to build our very own color wheel. Along the same lines, we will learn and understand web colors. So brace yourself with some color theory and a little math! If you are new to this channel and a beginner, please start with lesson 1. You need the proper tools to understand this lesson. What is color? How do we see color? How do we use colors? For beginners and non-beginners alike, this is a question. There is a philosophical way to answer this and there is the practical way. Color is how we perceive light. The human eye can see 7,000,000 colors. And it does this by sensing colors. How do humans sense color, you may ask. Simple. The human eye absorbs colors bouncing off different objects. For example. If we look at an apple, we see red right? But what’s really happening is that we see red because that’s the color not absorbed by the apple. It means that the apple, absorbed blue and green and reflects red. Thus, we see red. The same thing goes with any other color. If you see a blue car, it means that the colors’ red and green were absorbed by the car and blue is reflected. Speaking of red, green, and blue. RGB are primary colors. It means that all 7,000,000 colors we see is a combination of red, green, and blue. In 1801 Thomas Young, proposed this theory – the trichromatic color theory. Simply put, everything is composed of RGB. If you mix Red and Green, you get Yellow. If you mix Green and Blue, you get Cyan. If you mix Blue and Red, you get Magenta. If you mix all colors, you get black. This is called the secondary color palette or CMYK. Colors in html and CSS can be expressed in four ways. But will only focus on the most common ways – by name, rgb, and hexadecimal. Colors by name. If you want to use colors by name, you have about 140 standard color names at your disposal. Go to this link if you want to try them all. https://www.w3schools.com/colors/colors_names.asp In basic use, they can be applied as such: If you want to change the color of a text, you do this in CSS: font-color:red | green | blue; On the other hand, if you use the rgb method or hex method, it is done in this manner: color:rgb(0,0,0); for black. Zero means no light. color:rgb(255,255,255); for white. 255 means 100% brightness. color:rgb(255,0,0); for red. color:rgb(0,255,0); for green. color:rgb(0,0,255); for blue. Values can go from 0-255. On the other hand, for the hex method, it is done in this manner: color:#000. Zero means no light. color:#fff; for white. 255 means 100% brightness. color:#f00; for red. color:#0f0; for green. color:#00f; for blue. Do note that #000 is a shorthand for #000000. Using the 6 digit hexadecimal values gives you more colors. Values can go from 0-9 then a,b,c,d,e,f. This is the hexadecimal number system. So that’s 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f. A is 10, F is 15. You can try to mix and match any of the values. Most web developers prefer the hexadecimal method because it is easier to type. In this exercise we will build our very own interactive color wheel. To build this, we will use a lot of div tags and two main CSS declarations – the position and transform. The position CSS declaration tells the browser how to position html tags in the browser. For example, if you put in your CSS position:absolute, which we will use for this lesson, you are telling the browser to act like a grid. So, if you have an element, say a div and say that it has a position:absolute, the browser will wait for two more declarations. As you may have guessed, the left declaration tells the browser how far from the left the element should be placed. In the same manner, the top CSS declaration, tells the browser how far from the top of the browser the element should be placed. If you find this hard to understand, in Google Chrome or Mozilla Firefox webdeveloper tools, you can use the ruler tool to help you get the top and left values. Lastly, top and left values can be expressed in pixels or percents. To cap things off, let’s talk about the Transform declaration. For this lesson, we will only focus on the rotate attribute. The rotate attribute tells the browser to, well... yes... rotate the element. The rotate attribute uses the values in degrees. OK let’s code! Directory: -- Introduction -- Greetings -- Color theory -- Colors in computer code -- CSS position absolute -- CSS transform rotate -- Exercise -- Challenge *** MUSIC *** EDM Detection Mode by Kevin MacLeod is licensed under a Creative Commons Attribution license (https://creativecommons.org/licenses/by/4.0/) Source: http://incompetech.com/music/royalty-free/index.html?isrc=USUAN1500026 Artist: http://incompetech.com/
CSS Advance #4 Colors in CSS
 
10:07
Welcome to Tech Talk Tricks and in this video, we will learn about colors that how many ways we can insert color to html content. Learn how to use color in CSS like a pro. Style your website using CSS colors with Hex color codes, HTML color names, RGB, RGBA, HSL and HSLA values. Each parameter (red, green, and blue) defines the intensity of the color between 0 and 255. For example, rgb(255, 0, 0) is displayed as red, because red is set to its highest value (255) and the others are set to 0. To display the color black, all color parameters must be set to 0, like this: rgb(0, 0, 0). CSS Colors - RGB Values. This color value is specified using the rgb( ) property. This property takes three values, one each for red, green, and blue. The value can be an integer between 0 and 255 or a percentage. #RanaSingh #TechTalkTricks #colors #css #tutorial #trending #trend #trendingLanguage At Tech Talk Tricks you will learn HTML, CSS, SQL, PL/SQL, JAVA and many more computer as well as mobile tips and tricks. So please SUBSCRIBE to getting updated with the latest technology. css color picker, css color property, css color names, css text color, css background color, css color palette, css color rgb, html color, SUBSCRIBE our channel at : https://www.youtube.com/techtalktricks ************************************************** Follow Tech Talk Trick on Facebook https://www.facebook.com/techtalktricks ************************************************** Follow tech talk trick on Twitter https://twitter.com/tecktalktrick ************************************************** Follow Tech Talk Tricks on Instagram https://www.instagram.com/techtalktricks ************************************************** Subscribe tech talk tricks on YouTube https://www.youtube.com/techtalktricks ***************************************************
Views: 191 Tech Talk Tricks
change background color on button click using javascript
 
07:22
OM INFO TECH IT EXECUTION
Views: 7142 Vivek Kumar
CSS Tutorials #4 - How To Style Text
 
07:15
The 4th tutorial in the CSS tutorial series. In this lesson, I'll be showing you how to style text. Subscribe to Level Up Pro for extra features! https://www.leveluptutorials.com/store/products/pro For questions post in the comments or visit: http://leveluptuts.com/forum To Support Level Up Tuts: http://leveluptuts.com/donations
Views: 18681 LevelUpTuts
HTML Tutorials for Beginners 10 - HTML text formattings part 2
 
05:33
html text formatting, html text formatting tags, html text formatting in hindi, text formatting tags in html with example html text formatting html text formatting generator html text formatting color html text formatting tool html text formatting tumblr html text formatting examples html text formatting online html text formatting alignment html text formatting cheat sheet html text formatting paragraph html text formatting bullets html text formatting tags html text formatting attributes html text formatting app html text format arial html textarea formatting html formatting text around images html format text as code html format text as currency html format text as is html format text as typed html text formatting bold html text formatting br html text format block html text box formatting html formatting text background color html coding for textbox html text formatting line break html text formatting font bold html input text box format html text formatting codes html text formatting commands html text formatting css html text formatting center html text format check html text color formatting tags html text currency format html format text colour html text formatting definition html text format date html input text format date full html text format drupal 7 struts html text format date html text box date format html format text in div different html text formatting tags html display text with formatting html display text without formatting html text formatting elements html text formatting exercises html text formatting editor html text email format html coding text editor html versus text email format logical text-formatting element in html html text formatting font html text formatting font size html text field formatting html format text field phone number html coding text font html for text formatting fancy html text formatting facebook html text formatting html keep formatting for text html text formatting guide html formatting hyperlink text html text formatting indent html text formatting in table html text formatting italic html formatting text in textarea html text input formatting html format text in select option html format text inside textarea html format text into columns html format text inside select html format text inline html text formatting justify jira text formatting html html text keep formatting html text formatting line spacing html text formatting list html format text left html format text layout html text formatting tags list html text formatting new line html link text formatting html logical text formatting tags html-like text formatting html formatting text meaning html input text format mask maintain text formatting html html input text format money html text formatting normal html text format number html text without formatting html input text format number struts html text format number html text field number format html text number formatting html text formatting options html text format outlook text formatting of html sas ods html text formatting html keep formatting of text html select option formatting text html text formatting pdf html text formatting program html text formatting ppt html format text p html text formatting tags pdf html text formatting tags ppt sublime text html format plugin html preserve text formatting html paragraph text formatting html p text format qt html text formatting html text formatting right align html format text red html retain text formatting remove text formatting html html text formatting size html text formatting syntax html text formatting strikethrough html text formatting style html text formatting superscript html text format subscript html text space formatting html text style coding html text formatting tab html text formatting tutorial html text formatting table html text formatting toolbar html text formatting text html text time format html text formatting underline text formatting using html html program using text formatting tags text formatting in html using css html format text vertical html v text format html text formatting w3schools html format text width html to text with formatting c# html text box with formatting wordpress html text formatting convert html to text with formatting text formatting in html wikipedia formatting text in html with examples sublime text 3 html formatting html5 text formatting
Views: 1963 T3SO Tutorials
jquery background color animate
 
06:58
Link for all dot net and sql server video tutorial playlists https://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1 Link for slides, code samples and text version of the video http://csharp-video-tutorials.blogspot.com/2015/07/jquery-background-color-animate.html In this video we will discuss animating colors using jquery. With the basic jQuery functionality, animate() method cannot animate non-numeric style properties like color, background-color, and border-color. jQuery UI adds the ability to animate color properties. In the example below a reference to jQuery UI is included, hence the color animations work. If we remove the reference, color animations will not work, but other numeric style properties (font-size, border-width) continue to work. <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script src="jquery-1.11.2.js"></script> <script src="jquery-ui.js"></script> <script type="text/javascript"> $(document).ready(function () { var toggleColor = false; $('#btnAnimate').click(function () { var divElement = $('#myDiv'); if (toggleColor) { divElement.animate({ 'font-size': '15', 'border-width': '1', 'background-color': 'red', 'color': 'white', 'border-color': 'green' }, 2000); } else { divElement.animate({ 'font-size': '20', 'border-width': '10', 'background-color': 'green', 'color': 'white', 'border-color': 'red' }, 2000); } toggleColor = !toggleColor; }); }); </script> <style> </style> </head> <body style="font-family: Arial"> <form id="form1" runat="server"> <div id="myDiv" style="width: 500px; border: 1px solid black; padding: 5px; font-size: 15px"> At Pragim Technologies, training is delivered by real time software experts having more than 10 years of experience. Interview questions and real time scenarios discussion on topics covered for the day. Realtime projects discussion relating to the possible interview questions. Trainees can attend training and use lab untill you get a job. Resume preperation and mock up interviews. 100% placement assistance. 24 hours lab facility. </div> <br /> <input type="button" id="btnAnimate" value="Animate" /> </form> </body> </html>
Views: 15191 kudvenkat
CSS - Upgrading HTML Tags with Style: Creating a Website Made Easy
 
20:00
Lesson on Upgrading HTML Tags to CSS Style from Udemy online course: Creating a Website Made Easy Full course description and 25% discount coupon: http://tharsishighlands.com/online-courses/creating-a-website-made-easy/ Transcript: In this lesson, we will take many of the basic HTML tags and use them as CSS element selectors to upgrade their style. In CSS, the HTML tags are called "elements." BODY First, we start with the [body] tag element (YouTube does not allow angle brackets in description). When you first set up your main CSS file, you typically want to establish the basics for your entire page. These can include, • background-color • background-image • default font-size, color and font-family All of these can be handled in the body element. For example, body { background-color: linen; background-image: url("pix/tree.jpg"); font-family: Vera, Arial, Helvetica, sans-serif; font-size: 15px; color: #24425C; } SELECTORS We've already seen a little about CSS syntax. For example, h1 { color: blue; } Each CSS style starts with a selector and is followed by one or more declarations within open and close braces — each declaration being a property-value pair: { property: value } Element selectors select all HTML tags of the same name. For instance, for the [p] tag, p { text-align: center; color: red; } [p]All paragraphs with only the p tag are centered and red. This is a demonstration of how the element selector works.[/p] The ID selector uses the ID attribute of an HTML element to select that specific element. ID is a unique identifier. On any one page, there can be only one of that ID. Also, the ID name cannot start with a numeral. For example, #first_heading { color: red; } [h1 id="first_heading"]This is the First Heading on the Page[/h1] The class selector selects all elements with a specific class attribute. .quote { border-style: solid; border-width: 1px; border-color: #880000; padding: 5px; font-size: 18px; font-style: italic; } Here, we see a class called "quote" which uses larger type, italics and a dark red border. Next, is the HTML which uses that class. [p class="quote"]"There are more things in heaven and earth, Horatio, than are dreamt of in your philosophy."[/p] A class can be restricted to only one element type. For example, p.first { text-indent: 0px; } This can be helpful if all other paragraphs are given an indent. The first paragraph after a heading can be made flush left. We can also use more than one class at a time. For example, [p class="first quote"]"Houston, we have a problem..."[/p] We've already seen how selectors which share property values can be grouped. h1, h2, h3 { color: steelblue; } In the earlier lesson on the Head section, we learned how to link to an external style sheet — a file with sets of selectors and declarations. For internal CSS, you have the same selector-declaration combinations, but set within open and close [style] tags. [head] [style] body { background-color: darkslateblue; } [/style] [/head] And for inline CSS, you have the same selector-declaration combinations within a style attribute. [p style="text-indent: 50px; color: steelblue;"]This is important text.[/p] Multiple Styles Cascade into One CSS statements have a sequence of priority. The lowest priority of style is the browser defaults. Next are the external and internal style sheets in the head section. Sequence matters, so if you link to your external style sheet after the internal style declarations, the external CSS takes priority over the internal. Finally, the inline style declarations take the highest priority. For all style information that uses the same selectors, the highest priority replaces the lower priorities. For example, External: p { color: blue; text-indent: 30px; } Internal: p { color: green; } Inline: p { color: red; } The final style is: p { color: red; text-indent: 30px; } Background: The following properties control the background of HTML elements. • background-color • background-image • background-repeat • background-attachment • background-position Example: body { background-color: blue; } As we've already learned, colors can be specified, • As Hex — like "#00ffff" • As RGB — like "rgb(0,255,255)" • By name — like "aqua" We will learn more about colors and the new CSS3 color specification in a later lesson. Background Image: The default behavior of a background image is to repeat the image both vertically and horizontally in order to fill the entire background of the element with the selected picture. body { background-image: url("pix/sandbaked.gif"); } [...] In the next lesson, we talk about fonts, tables and links. Music: "Acid Jazz," "Darkness Speaks," and "Fanfare for Space" by Kevin MacLeod (incompetech.com) Licensed under Creative Commons: By Attribution 3.0 http://creativecommons.org/licenses/by/3.0/ Still: Clear Creek 5 by ImBooToo via Morguefile.com.
Views: 1465 Rod Martin, Jr.
Transparent Background with CSS
 
04:13
Learn how to make transparent backgrounds for your text and images using only CSS. Learn differences between HEX and RGBA color modes and how to convert any HEX color into a transparent one. Project Resources ----------------------------------------------------------------------------------------------------------- http://www.mediafire.com/download/aoabk8aekhuks31/How_do_I_give_text_or_an_image_a_transparent_background_using_CSS.7z Tools ----------------------------------------------------------------------------------------------------------- HEX to RGBA converter: http://hex2rgba.devoth.com/ Brackets, FREE code editor http://brackets.io/ Emmet, super speed coding addon http://emmet.io/ Beautify, turning your ugly code into beautiful script https://github.com/brackets-beautify/brackets-beautify Transcription ----------------------------------------------------------------------------------------------------------- Hi guys, today we will learn how to give a text or an image of transparent background using CSS, it's pretty easy so let's do this. Okay, let's add a one line of text, for example, paragraph of this is a text, with red background. Okay, in our main CSS file let's style a bit our paragraph text, so we can say they background color to be red. We have these background of red and let's say just add some padding so we can see better for example 20 pixels, okay, we had our red background but, it's not transparent. To make backgorund transparent we need to convert a this hex code into our RGBA code. Okay, we need to go to the this website it's a hextorgba.devoth.com it's a super easy method to convert your hex value. We got our hex value of red and we just say HEX to RGBA and on the right side we will get two values of this color, but our value we need value, it's bottom one, because it has this one extra number. I can, I will show you why is this important. Copy this RGBA and paste it back instead of your hex code. Okay, we paste these RGBA code and nothing happens of course. It will never happen in the first time because this is a web development :) you need to point, click and find out what is wrong. In this case, the wrong is this number one. We need to change this number one into 0.5 this is a 50% transparency, if we want 20% just add .2 or .1 You can see this is more transparent, and it's super easy. One thing only, you can write to these last number, it stands for alpha, because this is a red, green, blue, and alpha. Alpha controls the transparency. If we don't have alpha, we have nothing. Okay, let's say it's a 30%, you can write also with only a dot and a number tree, you can add a zero here but it will do nothing. So, I'll just write this like .3 lets now and background transparency for our image. Okay let's add our image, image I will say it's the image, image goes to image folder and one image of motherboard. In our main CSS we will add also in the image tag, we will add and also this background color, right, and you can't, you can't see the background color because it's the same as the image size. So, we add just some padding to squeeze that content inside, for example 30 pixels. And that's it guys. It's a pretty simple, okay, let's say it's a 70%. We made some border around it and it's a pretty easy to do this, so don't forget that you need to convert your hex to RGBA and you are good to go. Thank you and bye-bye!
Views: 7913 Filip Delac
jquery draggable widget
 
12:17
Link for all dot net and sql server video tutorial playlists https://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1 Link for slides, code samples and text version of the video http://csharp-video-tutorials.blogspot.com/2015/07/jquery-draggable-widget.html In this video we will discuss jquery draggable widget jquery draggable widget allow elements to be moved using the mouse. This widget is in interactions category on the jQuery UI website. http://jqueryui.com/draggable/ Consider the following HTML <div id="draggableDiv" class="divClass"> Drag me around </div> .divClass { height: 200px; width: 200px; background-color: red; color: white; display:table-cell; vertical-align:middle; text-align:center; } To make the above div element draggable $('#draggableDiv').draggable(); Some of the useful options to customize the draggable widget axis - Constrains dragging to either x or y axis containment - Constrains dragging to within the bounds of the specified element or region cursor - The CSS style of the cursor during the drag operation opacity - opacity during the drag operation revert - Boolean property that specifies if the element should revert to its start position when dragging stops revertDuration - The duration of the revert animation, in milliseconds snap - Specifies whether the element being dragged should snap to other elements. Value can be boolean or a selector. When set to true, the element will snap to all other draggable elements. When a selector is specified the element being dragged will snap to the element specified by the selector snapTolerance - The distance in pixels between the element being dragged and the element to which to snap to, at which snapping should occur. cancel - Prevents dragging from starting on specified elements Constrains dragging to x axis $('#draggableDiv').draggable({ axis : 'x' }); Constrains dragging to within the bounds of the parent element HTML <div id="containerDiv" style="height:300px; width:300px; border:3px solid black"> <div id="draggableDiv" class="divClass"> Drag me around </div> </div> jQuery $('#draggableDiv').draggable({ containment : 'parent' }); Changes the cursor style to "move" during the drag operation $('#draggableDiv').draggable({ cursor: 'move' }); Changes the opacity to 0.3 during the drag operation $('#draggableDiv').draggable({ opacity : '0.3' }); Reverts the div element to its start position when dragging stops. Revert animation completes in 1000 milli-seconds. $('#draggableDiv').draggable({ revert: true, revertDuration : 1000 }); The following example 1. Snaps the coloured div elements to the div element with thick black border. 2. The snapping occurs as soon as the distance between any of the coloured div element and the div element with thick black border is 50 pixels 3. The cancel option cancels dragging from starting on the div element with thick black border HTML <div id="redDiv" class="divClass" style="background-color: red"> Red Div </div> <div id="greeDiv" class="divClass" style="background-color: green"> Green Div </div> <div id="blueDiv" class="divClass" style="background-color: blue"> Blue Div </div> <div id="brownDiv" class="divClass" style="background-color: brown"> Brown Div </div> <br /> <br /> <div id="snapDiv" style="height: 400px; width: 400px; border: 5px solid black"> </div> Style .divClass { height: 200px; width: 200px; color: white; display: table-cell; vertical-align: middle; text-align: center; } jQuery $('div').draggable({ snap: '#snapDiv', snapTolerance: 50, cancel : '#snapDiv' });
Views: 23307 kudvenkat
Sublime Text Themes and Color Schemes (Tutorial #11)
 
05:34
I finally launched the full workflow course! https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBEDEAL Download Sublime Text (Buy it if you love it!) http://www.sublimetext.com/ Follow me on Twitter for resources and updates: https://twitter.com/learnwebcode
Views: 78610 LearnWebCode
How to create buttons in Javascript that change the color of an HTML element
 
12:26
~If you have any questions make sure to leave them in the comment section below! ~Subscribe for more videos! https://www.youtube.com/channel/UCsEmzdW4ry06BgbNGWQroFQ ~Help me provide better content for you lovely people https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=E8HHD98N3UFVG ==================================== EXTRA TAGS (ignore) CodingTuts Programming Become a programming pro Web design Web development Javascript Javascript elements Professional website with Javascript Responsive website with Javascript Javascript website Easy Javascript Javascript tricks & tips HTML HTML 5 CSS CSS tips and Tricks HTML and CSS Learn HTML Learn CSS Learn HTML fast Learn CSS fast Learn HTML easy Learn CSS easy Learn HTML fast and easy Learn CSS fast and easy Learn HTML and CSS Learn HTML and CSS fast Learn HTML and CSS easy Learn HTML and CSS fast and easy Website HTML website HTML and CSS website How to make a website How to make an HTML website How to make an HTML and CSS website Creating a website Creating an HTML website Creating an HTML and CSS website How to create a website How to create an HTML website How to create and HTML and CSS website Website fast HTML website fast HTML and CSS website fast How to make a website fast How to make an HTML website fast How to make an HTML and CSS website fast Creating a website fast Creating an HTML website fast Creating an HTML and CSS website fast How to create a website fast How to create an HTML website fast How to create an HTML and CSS website fast Website easy HTML website easy HTML and CSS website easy How to make a website easy How to make an HTML website easy How to make an HTML and CSS website easy Creating a website easy Creating an HTML website esy Creating an HTML and CSS website easy How to create a website easy How to create an HTML website easy How to create an HTML and CSS website easy Website fast and easy HTML website fast and easy HTML and CSS website fast and easy How to make a website fast and easy How to make an HTML website fast and easy How to make an HTML and CSS website fast and easy Creating a website fast and easy Creating an HTML website fast and easy Creating an HTML and CSS website fast and easy How to create a website fast and easy How to create an HTML website fast and easy How to create an HTML and CSS website fast and easy ====================================
Views: 23451 CodingTuts
Bulleted List HTML, Change the color of Bullets | Quick Tutorial
 
02:25
This video is going to show you how to change the bullet color of a list using two different methods. Follow Us Facebook: http://bit.ly/2srBAX7 Twitter: http://bit.ly/2tAEvgG Instagram: http://bit.ly/2tbfnKn Discover more Tutorials on: http://www.22bulbjungle.com html bullet points, html bullet, ordered list html, css list style type, bulleted list, html ordered list, ul list style, bullet point html, html unordered list, html bullet code, bulleted list html, css li text color, royal enfield bullet color, how to change color of unordered list in html, list style bullet Subscribe to us : https://www.youtube.com/channel/UCaU1VsZaFQ1hHq8P2dGrJMw?sub_confirmation=1 CSS important Override | How to override !important https://www.youtube.com/watch?v=62IThMK9pzg CSS Font Shorthand | Combining font values into one property https://www.youtube.com/watch?v=vV-D4QUV99s CSS Font Shorthand Combining font values into one property https://www.youtube.com/watch?v=cZcqDBR5Zj4 CSS Background Image Color Overlay https://www.youtube.com/watch?v=2D62KK_WAGo Make a DIV the same Width and Height as Image https://www.youtube.com/watch?v=ksYaUXsJu_Y MARGIN VS PADDING watch here: https://www.youtube.com/watch?v=MwBqer-xRy8 Change CSS Selection Color. watch: https://www.youtube.com/watch?v=Zgj5gKxx6aY Add custom Fonts in CSS: https://www.youtube.com/watch?v=D2bO-_RX7MA CSS Placeholder Color https://www.youtube.com/watch?v=HHhC67Gtalo How to disable someone from copying texts in your website: https://www.youtube.com/watch?v=a2MS1jd9M_w How to properly add background image with CSS: https://www.youtube.com/watch?v=dfqR3sEnj6k How to center a div inside a div: https://www.youtube.com/watch?v=RCoQOS4s5ls How to create unordered list without bullets: https://www.youtube.com/watch?v=_KXobsfRlPQ
Views: 5225 garnatti one
jQuery attribute selector
 
08:17
Link for all dot net and sql server video tutorial playlists https://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1 Link for slides, code samples and text version of the video http://csharp-video-tutorials.blogspot.com/2015/03/jquery-attribute-selector.html In this video we will discuss selecting elements 1. That have specified attribute 2. That have specified attribute values Syntax : $('[attribute]') $('[attribute="value"]') $('[title]') // Selects all elements that have title attribute $('div[title]') // Selects all div elements that have title attribute $('[title="divTitle"]') // Selects all elements that have title attribute value - divTitle $('div[title="divTitle"]') // Selects all div elements that have title attribute value - divTitle Selects all elements with title attribute and sets 5px solid red border [html] [head] [title][/title] [script src="Scripts/jquery-1.11.2.js"][/script] [script type="text/javascript"] $(document).ready(function () { $('[title]').css('border', '5px solid red'); }); [/script] [/head] [body] [div title="div1Title"] DIV 1 [/div] [br /] [div title="div2Title"] DIV 2 [/div] [p title="pTitle"] This is a paragraph [/p] [span title="div1Title"] SAPN 1 [/span] [br /][br /] [span] SPAN 2 [/span] [/body] [/html] Selects all div elements with title attribute and sets 5px solid red border [script type="text/javascript"] $(document).ready(function () { $('div[title]').css('border', '5px solid red'); }); [/script] Selects all elements with title attribute value - div1Title, and sets 5px solid red border [script type="text/javascript"] $(document).ready(function () { $('[title="div1Title"]').css('border', '5px solid red'); }); [/script] Selects all div elements with title attribute value - div1Title, and sets 5px solid red border [script type="text/javascript"] $(document).ready(function () { $('div[title="div1Title"]').css('border', '5px solid red'); }); [/script] Selects all div elements with both title and style attributes, and sets 5px solid black border [html] [head] [title][/title] [script src="Scripts/jquery-1.11.2.js"][/script] [script type="text/javascript"] $(document).ready(function () { $('div[title][style]').css('border', '5px solid black'); }); [/script] [/head] [body] [div title="divTitle" style="background-color:red"] Red DIV [/div] [br /] [div title="divTitle" style="background-color:green"] Green DIV [/div] [br /] [div title="divTitle"] Normal Div [/div] [br /] [div] Normal Div without any attributes [/div] [/body] [/html] Selects all div elements with title attribute value - divTitle, and style attribute value - background-color:red, and sets 5px solid black border [script type="text/javascript"] $(document).ready(function () { $('div[title="divTitle"][style="background-color:red"]').css('border', '5px solid black'); }); [/script] Selects all div elements with either title or style attributes, and sets 5px solid black border [script type="text/javascript"] $(document).ready(function () { $('div[title],[style]').css('border', '5px solid black'); }); [/script]
Views: 102627 kudvenkat
Jquery Color & Font Switcher - Part 2 - HTML
 
08:48
Macedonian Web Design Tutorial for macedonians on macedonian language :) за повеќе одете на www.tajfa.com
Views: 350 Ivo Culic
CSS Tutorial - 22 Adding a Background Color to heading.mp4
 
02:50
This video shows you how to style your heading with background-color in css Don't Forget to Check out my other Cheatcodes on Css as well as Html5.
Views: 4030 Wiredwiki English
jQuery wrap elements
 
06:52
Link for all dot net and sql server video tutorial playlists https://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1 Link for slides, code samples and text version of the video http://csharp-video-tutorials.blogspot.com/2015/04/jquery-wrap-elements.html In this video we will discuss how to wrap and unwrap elements The following jquery methods are used to wrap and unwrap elements. Since these methods modify DOM, they belong to DOM manipulation category. wrap unwrap wrapAll wrapInner wrap - Wrap an HTML structure around each element in the set of matched elements. Consider the following HTML <div id="div1"> DIV 1 </div> <div id="div2"> DIV 2 </div> <div id="div3"> DIV 3 </div> The following line of code wraps each of the above div element with another div element. $('div').wrap('<div class="containerDiv"></div>'); So the HTML in the DOM would now look as shown below. To view the DOM HTML use the browser developer tools. <div class="containerDiv"> <div id="div1"> DIV 1 </div> </div> <div class="containerDiv"> <div id="div2"> DIV 2 </div> </div> <div class="containerDiv"> <div id="div3"> DIV 3 </div> </div> Example : <html> <head> <title></title> <style> .containerDiv { background-color:red; color:white; font-weight:bold; margin: 5px; } </style> <script src="jquery-1.11.2.js"></script> <script type="text/javascript"> $(document).ready(function () { alert($('div.containerDiv').length); $('div').wrap('<div class="containerDiv"></div>'); alert($('div.containerDiv').length); }); </script> </head> <body style="font-family:Arial"> <div id="div1"> DIV 1 </div> <div id="div2"> DIV 2 </div> <div id="div3"> DIV 3 </div> </body> </html> unwrap - Remove the parents of the set of matched elements from the DOM. Example : <html> <head> <title></title> <style> .containerDiv { background-color:red; color:white; font-weight:bold; margin: 5px; } </style> <script src="jquery-1.11.2.js"></script> <script type="text/javascript"> $(document).ready(function () { alert($('div.containerDiv').length); $('div').wrap('<div class="containerDiv"></div>'); alert($('div.containerDiv').length); $('div').unwrap(); alert($('div.containerDiv').length); }); </script> </head> <body style="font-family:Arial"> <div id="div1"> DIV 1 </div> <div id="div2"> DIV 2 </div> <div id="div3"> DIV 3 </div> </body> </html> wrapAll - Wrap an HTML structure around all elements in the set of matched elements. Consider the following HTML <div id="div1"> DIV 1 </div> <div id="div2"> DIV 2 </div> <div id="div3"> DIV 3 </div> The following line of code wraps all of the matching div element with another div element. $('div').wrapAll('<div class="containerDiv"></div>'); So the HTML in the DOM would now look as shown below. <div class="containerDiv"> <div id="div1"> DIV 1 </div><div id="div2"> DIV 2 </div><div id="div3"> DIV 3 </div> </div> wrapInner - Wrap an HTML structure around the content of each element in the set of matched elements. Consider the following HTML <div id="div1"> DIV 1 </div> <div id="div2"> DIV 2 </div> <div id="div3"> DIV 3 </div> The following line of code wraps each of the above div element content with another div element. $('div').wrapInner('<div class="containerDiv"></div>'); So the HTML in the DOM would now look as shown below. <div id="div1"> <div class="containerDiv"> DIV 1 </div> </div> <div id="div2"> <div class="containerDiv"> DIV 2 </div> </div> <div id="div3"> <div class="containerDiv"> DIV 3 </div> </div>
Views: 46639 kudvenkat
CSS Tutorial — Colors, Hex, RGB, RGBA, Predefined Colors (4/13)
 
04:24
CSS Tutorial — Colors, Hex, RGB, RGBA, Predefined Colors (4/13) Colors are probably the most effective, obvious way for you to communicate with your audience. You can add colors to several places on your page: For example: text color, Which in CSS is just Color. It’s what we’ve been using so far. Color: Red, right? .. Hello? Are you awake?... Good ;) background-color: changes the background of that element Or border-color: same thing for border. Let’s change the background color for example. I can say select the body tag. Change background-color to red. Gross. But it works. So the value can be the color name in English, like red, or blue, or green. What if I want a lighter red. There’s no official lighter red! Lighter by how much? Well then you can use Color values that are more specific. For example HEX values. HEXADECIMAL LIFE. Every color you can possibly think of has a HEX value. You can get pretty specific with these. And in most cases you will. They’re a little weird but you don’t have to remember them, you can just click on this box in chrome dev tools and use this awesome color wheel to choose exactly the color that you want. Or if you work with a designer they’ll hopefully give you these values. They start with a # followed by 6 numbers. So this for example is how you set the color to red using HEX. This is HEX for red. The reason HEX values exist is because there are far more colors available than we can describe in english. So, you can define the color using it’s HEX value instead of plain english. I’ve been using a website called ColourLovers.com for many years. You can find amazing combinations of colors on there, including their HEX value. You can also use RGB values. If you’re a designer you know what I’m talking about. RGB stands for red green blue. Each value goes from 0 to 255 and represents each basic color. RED, GREEN, BLUE. You can create all the colors in the world that your eyes could possibly see with RGB. Notice in Chrome Dev tools you can see the RGB value as well as HEX. So you say color, rgb, and in parenthesis you add 3 values separated by a comma. There’s also RGBA and this is a big one, it’s for advanced programmers, so hold on to your butts. That’s red green blue alpha. The Alpha channel is the transparency level of your color.  Or the opacity level. Meaning how much can you see through the color? By default all colors are at 100%. So you can’t see through them. So their Alpha value is 1. It goes from 0 to 1. So if you change the alpha value to say .5, that means 50%, .2 means 20%. Again, You can go from 0 to 1. And the default is 1. 100% There are other ways to specify color like HSL (Hue, Saturation, Lightness). Or HWB (Hue, Whiteness, Blackness). I’ve personally never used either, there might even be other ways but most people use HEX or RGB and so for the purposes of this course we won’t use anything else. You can read more about Colors on W3Schools if you’re that obsessed. Good luck to you. So anywhere you can add a color you can use any of these values. Now, instead of showing you some lame little example, we’re gonna give colors to your profile page, the one that you built in the HTML Basics course. If you don’t have it, that’s ok, you can either go back and make it or go to this URL on ColorCode’s github account and get it. Click on this download button and you can get a ZIP file that has the HTML template. Also,  make sure to follow ColorCode on Github so you see the updates. So, my friend, let’s go Color some stuff.
Views: 527 ColorCode
jQuery Element Selector
 
11:54
Link for all dot net and sql server video tutorial playlists http://www.youtube.com/user/kudvenkat/playlists Link for slides, code samples and text version of the video http://csharp-video-tutorials.blogspot.com/2015/03/jquery-element-selector.html In this video we will discuss jQuery Element Selector, i.e selecting elements by tag name. To select the elements by tag name use jQuery Element Selector Syntax : $(element) $('td') // Selects all td elements $('div a') // Select all anchor elements that are descendants of div element $('div, span, a') // Selects all div, span and anchor elements Alerts the total count of td elements on the page [script type="text/javascript"] $(document).ready(function () { alert($('td').length); }); [/script] Selects all the tr elements on the page and changes their background colour to red [script type="text/javascript"] $(document).ready(function () { $('tr').css('background-Color', 'red'); }); [/script] Alerts the HTML content of the table [script type="text/javascript"] $(document).ready(function () { alert($('table').html()); }); [/script] Alerts the HTML content of each table row [script type="text/javascript"] $(document).ready(function () { $('table tr').each(function () { alert($(this).html()); }); }); [/script] Select and changes the background colour of all the div, span and anchor elements [script type="text/javascript"] $(document).ready(function () { $('div, span, a').css('background-Color', 'yellow'); }); [/script] Select all anchor elements that are descendants of div element [html] [head] [title][/title] [script src="jquery-1.11.2.js"][/script] [script type="text/javascript"] $(document).ready(function () { $('div a').css('background-Color', 'yellow'); }); [/script] [/head] [body] [div] [a href="http://pragimtech.com"]PragimTech[/a] [/div] [br /] [a href="http://microsoft.com"]Microsoft[/a] [/body] [/html] Changes the background color of even rows to gray and odd rows to yellow in both the tables. [script type="text/javascript"] $(document).ready(function () { $('tr:even').css('background-Color', 'gray'); $('tr:odd').css('background-Color', 'yellow'); }); [/script] To change the background color of even rows to gray and odd rows to yellow just for one of the table, use #id selector along with element selector. [script type="text/javascript"] $(document).ready(function () { $('#table1 tr:even').css('background-Color', 'gray'); $('#table1 tr:odd').css('background-Color', 'yellow'); }); [/script]
Views: 135791 kudvenkat
Transparent & Semi Transparent Div Background in Hindi | HTML & CSS3 Trick
 
04:55
In this video, you'll learn how to set a transparent div in which only the background of the content will be transparent. Its a easy css3 trick which helps you in making more attractive web pages. Watch this video and learn in Hindi/Urdu HTML5 & CSS3 हिन्दी मे सीखे ...HTML5 & CSS3 हिन्दी मे सीख कर web design मे expert bane.. web design सिखने के लिए शुरु करे HTML5 & CSS3 tutorial हिन्दी मे । ... Learn HTML5 & CSS3 in Hindi and Make yourself expert in HTML5 & CSS3 in Hindi for learning web designing with Hindi HTML5 & CSS3 learning tutorial you can learn HTML5 & CSS3 easily with this HTML5 & CSS3 in Hindi tutorial. it is great platform for learning HTML5 & CSS3 in Hindi. HTML5 & CSS3 Tutorial in Hindi/Urdu for beginner to expert.... This course is one of the best courses designed for beginners in HTML5 & CSS3. Watch this HTML5 & CSS3 in Hindi video tutorials series to learn HTML5 & CSS3 from Basic to advance. In this course, you'll learn the complete web design structure in Hindi/Urdu. Watch | Like | Share the video and subscribe the channel. =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- Connect with us on ... Visit Website @ http://www.vishacademy.com facebook » http://www.facebook.com/vishacademy twitter » http://www.twitter.com/vishAcademy youtube » http://www.youtube.com/vishacademy -~-~~-~~~-~~-~- Please watch: "Design Mobile App and Web Mockups in Your Mobile | vishAcademy" https://www.youtube.com/watch?v=FF9q1rnCTmE -~-~~-~~~-~~-~-
Views: 35018 vishAcademy
Trending Tweet Present : How to Make Moving Text Field Using HTML,Javascript,CSS
 
04:44
Trending Tweet Present : How to Make Moving Text Field Using HTML,Javascript,CSS PLEASE LIKE,SHARE AND SUBCRIBE MY CHANNEL!! *Coding*: <html> <head> <style> div{ border: 1px solid ; overflow: hidden; background-color:red; color:white; font-size:20px; font-weight:bold; } </style> <script> function on_load(){ setInterval('headline()',10); } var count =0; function headline(){ count++; document.getElementById('headline').style.marginLeft = count+"px"; if(count==1000){ count=-1800; document.getElementById('headline').style.marginLeft = count+"px"; } } </script> </head> <body onload="on_load()"> <div> <pre id="headline">Subcribe my channel for more videos Subcribe my channel for more videos Subcribe my channel for more videos Subcribe my channel for more videos</pre> </div> </body> </html> PLEASE LIKE,SHARE AND SUBCRIBE MY CHANNEL!!
Views: 9 Trending Tweet
jQuery video tutorial 10 - jQuery CSS Method
 
11:07
jQuery CSS() Method: The jQuery CSS() method is used to set one or more CSS style(s) to the selected HTML element(s). It is also used to get the value of a CSS style applied to the selected HTML element(s). Setting the single CSS style or property: Syntax: $(selector).css(“css-property”,”value”); It helps us to select any html element(s) targeted by the given selector and apply the given CSS property. Ex: $(“#firstp”).css(“background-color”,”red”); It selects any html element(s) whose id attribute value is set to firstp and applies the CSS property background color to red . Setting multiple CSS styles or properties: Syntax: $(selector).css({“css-property1”:”value1”,” css-property2”:”value2”,….}); It helps us to select any html element(s) targeted by the given selector and apply the given set of CSS properties. Ex: $(“#firstp”).css({“background-color”:”green”,”color”:”white”}); It selects any html element(s) whose id attribute value is set to firstp and applies the CSS properties background color green and text color white . Getting the value of a single CSS style or property: Syntax: $(selector).css(“css property”); It helps us to select any html element(s) targeted by the given selector and return the value of a given CSS property. Ex: alert($(“#firstp”).css(“background-color”)); It selects any html element(s) whose id attribute value is set to firstp and returns the value of background-color CSS property. The current implementation of the CSS() method in jQuery allows us to set multiple CSS properties to the selected HTML element(s), but only allows us to get one CSS property at a time. ======================================================== Follow the link for next video: https://youtu.be/HpRdrhCq158 Follow the link for previous video: https://youtu.be/UvMuWgBzIHc ========= For more benefits & Be up to date =================== Subscribe to the channel: https://www.youtube.com/chidrestechtu... Like the Facebook fan page: https://www.facebook.com/ManjunathChidre Visit to Chidre's Tech Tutorials website: http://www.chidrestechtutorials.com ========================================================
HTML Tutorial 8 - Changing Hyperlink Color
 
07:33
In this tutorial, we talk about how to change the color of both active and visited links on our webpages, using the "a link" and "vlink" attributes in the "body" tag of an HTML document. If you have any questions, comments, or suggestions, please feel free to leave a comment below! Thank you for watching! I appreciate it! TechnicalCafe Blog http://TechnicalCafe.com TechnicalCafe Twitter http://Twitter.com/TechnicalCafe Jamie's Twitter http://Twitter.com/Jamiemcg
Views: 34968 TechnicalCafe
How to change background color on button click using html and jquery
 
23:14
Jquery onmouseover changing the background. This tutorial helps you to change the background color on mouse hovering with simple and easy steps using javascript/jquery.
Views: 710 Lucky 436
Click to Change Color with jQuery
 
00:30
This short demo shows 2 ways to change paragraph text color when user click on the paragraph.
Views: 1005 Chuwei Lu
Q+A - How to alternate text color using JavaScript
 
05:17
Q: How do I color every second character of a string into red in javascript? for example: var a="This is a string". I want the first, the third character and so on to be colored in red. A: Split the string into an array holding each character in the string. Loop over that array and use condition logic to see if the array index position is divisible by any number you wish. If it is then you alter the target element to your liking. Watch the video for code explanation.
Views: 17123 Adam Khoury
Assigning event handlers in JavaScript using DOM object property
 
10:20
Link for all dot net and sql server video tutorial playlists http://www.youtube.com/user/kudvenkat/playlists Link for slides, code samples and text version of the video http://csharp-video-tutorials.blogspot.com/2015/01/assigning-event-handlers-in-javascript.html In JavaScript there are several ways to associate an event handler to the event. In Part 36, we discussed, associating event handler methods to events using the attributes of HTML tags. In this video we will discuss using DOM object property to assign event handlers to events. First let us understand, what is DOM DOM stands for Document Object Model. When a browser loads a web page, the browser creates a Document Object Model of that page. The HTML DOM is created as a tree of Objects. Example : [html] [head] [title]My Page Title[/title] [/head] [body] [script type="text/javascript"] [/script] [div] [h1]This is browser DOM[/h1] [/div] [/body] [/html] JavaScript can be used to access and modify these DOM objects and their properties. For example, you can add, modify and remove HTML elements and their attributes. Along the same lines, you can use DOM object properties to assign event handlers to events. We will discuss the DOM object in detail in a later video session. We will continue with the same examples that we worked with in Part 36. Notice that in this case, we are assigning event handlers using the DOM object properties (onmouseover & onmouseout) instead of using the attributes of the HTML tag. We are using this keyword to reference the current HTML element. In this example "this" references the button control. [input type="button" value="Click me" id="btn"/] [script type="text/javascript"] document.getElementById("btn").onmouseover = changeColorOnMouseOver; document.getElementById("btn").onmouseout = changeColorOnMouseOut; function changeColorOnMouseOver() { this.style.background = 'red'; this.style.color = 'yellow'; } function changeColorOnMouseOut() { this.style.background = 'black'; this.style.color = 'white'; } [/script] The following example is same as the above. In this case we are assigning an anonymous function to onmouseover & onmouseout properties. [input type="button" value="Click me" id="btn" /] [script type="text/javascript"] document.getElementById("btn").onmouseover = function () { this.style.background = 'red'; this.style.color = 'yellow'; } document.getElementById("btn").onmouseout = function () { this.style.background = 'black'; this.style.color = 'white'; } [/script] If an event handler is assigned using both, i.e an HTML attribute and DOM object property, the handler that is assigned using the DOM object property overwrites the one assigned using HTML attribute. Here is an example. [input type="button" value="Click me" id="btn" onclick="clickHandler1()"/] [script type="text/javascript"] document.getElementById("btn").onclick = clickHandler2; function clickHandler1() { alert("Handler set using HTML attribute"); } function clickHandler2() { alert("Handler set using DOM object property"); } [/script] Using this approach you can only assign one event handler method to a given event. The handler that is assigned last wins. In the following example, Handler2() is assigned after Handler1. So Handler2() owerites Handler1(). [input type="button" value="Click me" id="btn"/] [script type="text/javascript"] document.getElementById("btn").onclick = clickHandler1; document.getElementById("btn").onclick = clickHandler2; function clickHandler1() { alert("Handler 1"); } function clickHandler2() { alert("Handler 2"); } [/script]
Views: 50524 kudvenkat
Tutorial Dasar Html #3  - Membuat Background Color Pada Html
 
04:59
Assalamu'alaikum wr wb, kali ini saya akan berbagi tutorial bagaimana cara membuat background color menggunakan html. semoga bermanfaat background color pada html cara membuat background color pada html cara memberi background color pada html background color with html code change background color with html set background color with html background color with image html css background color with html background color html5 background color html table background color html div background color html transparent background color with html background color html text background color html and css background color html a background color of a html table cell how to add background color with html how to make a background color with html how to put a background color with html background color html alpha background-color area html a background color html add a background color html set a background color html text with a background color in html a href background color html background color html body background color html black background color html button html background color with background image background color html blue background color html black code background color html css background color html css code background color html code table background color html coding background color html change background color html container background color html code white background color html cell table background color di html background color html div tag background color html dreamweaver background color html degradado background color html definition background color html dom background color degraded html using css background color degrade html background color en html background color html email background color html element background color html email outlook background color em html background color effects html background colour html ebay set background color html element background color html internet explorer background color html for div background color html rojo background color html row background color red html code background color repeat html set background color html rgb background colour red html background color html style background color html script background color set html background color html syntax background color html section background color html span background color html select background color html size background color html selector background color html table cell background color html tr background color to html background color code html table background color textbox html background color text html code background color using html background color in html using css background color url html background color in html using style background color in html using div change background color html using javascript change background color html using radio buttons background color html values background color html w3schools background color html w3school background color html website background color html white code change background color html web page background color html white background color html wordpress background color html w3 background color html wikipedia background color html yellow background color light yellow html how do you change the background color with html 2 color background html html4 background color body background color html 4 html5 background color html5 background color code html5 background color transparent html5 table background color html5 body background color div background color html5
Views: 1042 Tutorial Channel
HTML Introduction Part 2: TAGS
 
04:35
Well Done! You have covered some basic tags. To find out more on tags and attributes visit W3schools link is in the description. Which topic you want us to cover next. Share your thoughts in the comment section. Like and subscribe for more videos. Source: https://www.w3schools.com/tags/ref_byfunc.asp Code: ----------------------------------------- <html> <head> <title>HTML Introduction - Part 2</title> </head> <body> <h1>Before Applying Paragraph Tag</h1> As the name suggest, if the HTML page contains multiple paragraphs, this tag helps in defining the paragraphs body. It is a type of container tag and, It is a way to structure your text into different paragraphs. Each paragraph of text should go in between an opening and a closing tag. Browsers automatically add some space (margin) before and after each paragraph element <h1>After Applying Multiple Paragraph Tag</h1> <p>As the name suggest, if the HTML page contains multiple paragraphs, this tag helps in defining the paragraphs body. It is a type of container tag and, It is a way to structure your text into different paragraphs.<p></p> Each paragraph of text should go in between an opening and a closing tag. Browsers automatically add some space (margin) before and after each paragraph element</p> </body> </html> ----------------------------------------- <html> <head> <title>HTML Introduction - Part 2</title> </head> <body> <h1>Before Applying br Tag</h1> This is a sentence. This is another sentence. <h1>After Applying br Tag</h1> This is a sentence.<br> This is another sentence. </body> </html> ----------------------------------------- <html> <head> <title>HTML Introduction - Part 2</title> </head> <body> <h1>Before Applying background attribute</h1> This HTML page has no background image. </body> </html> ----------------------------------------- <html> <head> <title>HTML Introduction - Part 2</title> </head> <body background="background.jpg"> <h1>After Applying background attribute</h1> This HTML page has a background image. </body> </html> ----------------------------------------- <html> <head> <title>HTML Introduction - Part 2</title> </head> <body > <h1>Before Applying text color attribute</h1> This HTML page text has default color. </body> </html> ----------------------------------------- <html> <head> <title>HTML Introduction - Part 2</title> </head> <body text="orange" > <h1>After Applying text color attribute</h1> This HTML page text has ORANGE color. </body> </html> ----------------------------------------- <html> <head> <title>HTML Introduction - Part 2</title> </head> <body bgcolor="purple" text="orange" > <h1>After Applying background color & text color attribute</h1> This HTML page has purple background and text has ORANGE color. </body> </html> ----------------------------------------- <html> <head> <title>HTML Introduction - Part 2</title> </head> <body > <h1>This is H1 heading and biggest in size.</h1><br> <h2>This is H2 heading.</h2><br> <h3>This is H3 heading.</h3><br> <h4>This is H4 heading.</h4><br> <h5>This is H5 heading.</h5><br> <h6>This is H6 heading and smallest in size.</h6><br> </body> </html> ----------------------------------------- <html> <head> <title>HTML Introduction - Part 2</title> </head> <body > <font size="3" color="red"><h1>This is H1 heading with color Red.</h1><br></font> <font size="2" color="blue"><h2>This is H2 heading with size 2 therefore smaller than other headings in size and color is blue.</h2><br></font> <font face="verdana" color="green"><h3>This is H3 heading with different font and color green.</h3><br></font> </body> </html> ----------------------------------------- <html> <head> <title>HTML Introduction - Part 2</title> </head> <body > This is normal sentence <br><br> <h3> <b>This is bold sentence</b> </h3> <br> <h3> <i>This is italic sentence</i> </h3> <br> <h3> <u>This is underline sentence </u></h3> <br> </body> </html> ----------------------------------------- My Blogs https://azblogs4u.blogspot.com/ https://atozcreations4u.wixsite.com/insights PACIFIC SUN by Nicolai Heidlas Music https://soundcloud.com/nicolai-heidlas Creative Commons — Attribution 3.0 Unported— CC BY 3.0 http://creativecommons.org/licenses/b... Music promoted by Audio Library https://youtu.be/kbqmEJTr3nU
Views: 39 LEARNITIUM
1960 Ford F-100 Milford CT Stratford, CT #C0K55380 - SOLD
 
00:41
http://www.napoliclassics.com/ SOLD - Phone: 203-668-7797 Year: 1960 Make: Ford Model: F-100 Trim: Flareside Transmission: Manual Color: Red Interior: Black Stock #: C0K55380 style type="text/css" !-- #napoli-container { background-color: #000; color: #FFF; font-weight: bold; font-family: Arial, Helvetica, sans-serif; text-align: left; } #napoli-title { font-size: x-large; padding: 12px; text-align: center; text-transform: uppercase; } #napoli-subtitle { font-size:x- large; text-align: left; text-transform: uppercase; } #napoli-box { width: 550px; margin: 0 auto; padding: 15px; border-width: 3px; border-color: #FFF; border-style: solid; text-align: left; } #napoli-vitals { font-size: large; text-align: left; padding-top: 0px; padding-left: 15px; line-height: 1.3em; color: white } #napoli-boxtitle { font-size: x-large; text-align: center; padding-top: 10px; padding-bottom: 10px; padding-left: 5px; text-transform: uppercase; } #napoli-contact { font-size: x-large; text-align: center; padding: 15px 0px 55px; } -- /style div id="napoli-container" div id="napoli-title" span style="color:red;line-height:150%;" 1960 FORD F100 FLARESIDEbr 302 C.I. 4 SPEEDbr 6.5' BEDbr /span /div br / br / div id="napoli-title" span style="color:yellow;line-height:150%;" SEE ME AT MECUM br IN HARRISBURG JULY 24 THRU JULY 26 /span /div br / br / div id="napoli-box" div id="napoli-vitals" YEAR: 1960br MAKE: FORDbr MODEL: F100br BODY: FLARESIDE SHORTBEDbr COLOR: REDbr TRIM: BLACKbr ENGINE: 302 C.I.br TRANSMISSION: 4 SPEEDbr REAR: 3.70 RATIObr MILES: 12 (ON ENGINE)br SERIAL #: F10C0K55380br /div /div br / br / div id="napoli-boxtitle"span style="color:red;"OPTIONS/span/div div id="napol Napoli Motors, located in Milford, CT has been family owned and operated since 1959.Our commitment to family values makes us a popular choice throughout Fairfield and New Haven Counties.Come let us show you why. At Napoli Motors we pride ourselves on our commitment to outstanding customer service.We will ensure that you get the car you want at a competitive price, we will give you top dollar for your trade in and we will work with you on financing plus get worry free car buying with Napoli's 30 day or 1500 mile exchange policy. Address: 241 Boston Post Rd Milford CT Stratford, CT 06460
Views: 84 Napoli Classics
Simple jquery progress bar
 
11:05
Link for all dot net and sql server video tutorial playlists https://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1 Link for slides, code samples and text version of the video http://csharp-video-tutorials.blogspot.com/2015/05/simple-jquery-progress-bar.html In this video we will discuss how to create a simple animated jquery progress bar using animate() function. Replace < with LESSTHAN symbol and > with GREATERTHAN symbol <html> <head> <script src="jquery-1.11.2.js"></script> <script type="text/javascript"> $(document).ready(function () { $('#myButton').click(function () { animateProgressBar($('#ddlPercent').val()); }); function animateProgressBar(percentComplete) { $('#innerDiv').animate({ 'width': (500 * percentComplete) / 100 }, 2000); $({ counter: 1 }).animate({ counter: percentComplete }, { duration: 2000, step: function () { $('#innerDiv').text(Math.ceil(this.counter) + ' %'); } }); } }); </script> </head> <body style="font-family:Arial"> Select percentage : <select id="ddlPercent"> <option value="10">10</option> <option value="20">20</option> <option value="30">30</option> <option value="40">40</option> <option value="50">50</option> <option value="60">60</option> <option value="70">70</option> <option value="80">80</option> <option value="90">90</option> <option value="100">100</option> </select> <input type="button" id="myButton" value="Start Animation" /> <br /><br /> <div id="outerDiv" style="background-color:#EEEEEE; height:20px; width:500px; padding:5px"> <div id="innerDiv" style="width:0px; height:19px; text-align:center; background-color:red; color:white"></div> </div> </body> </html>
Views: 40568 kudvenkat
jQuery Resizable Widget
 
13:44
Link for all dot net and sql server video tutorial playlists https://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1 Link for slides, code samples and text version of the video http://csharp-video-tutorials.blogspot.com/2015/07/jquery-resizable-widget.html In this video we will discuss jQuery Resizable Widget jQuery Resizable Widget allows you to change the size of an element using the mouse Consider the following HTML and CSS <div id="redDiv" class="divClass" style="background-color: red"> Red Div </div> <style> .divClass { font-family: Arial; height: 150px; width: 150px; text-align: center; color:white } </style> To make the div element resizable $(document).ready(function () { $('#redDiv').resizable(); }); jQuery Resizable Widget Options alsoResize - Allows to resize one or more elements synchronously with the resizable element animate - Animates to the final size after resizing. Include .ui-resizable-helper class to display outline while resizing aspectRatio - Specifies whether the element should preserve aspect ratio autoHide - Specifies whether the resize handles should hide when the user is not hovering over the element containment - Constrains resizing to within the bounds of the specified element or region ghost - specifies whether a semi-transparent helper element should be shown for resizing maxHeight - The maximum height you can resize to minHeight - The minimum height you can resize to maxWidth - The maximum width you can resize to minWidth - The minimum width you can resize to jQuery Resizable Widget Events start - Triggered at the start of a resize operation stop - Triggered at the end of a resize operation resize - Triggered during the resize operation Resizing redDiv will also resize blueDiv HTML <div id="redDiv" class="divClass" style="background-color: red"> Red Div </div> <br /> <div id="blueDiv" class="divClass" style="background-color: blue"> Red Div </div> jQuery $(document).ready(function () { $('#redDiv').resizable({ alsoResize:'#blueDiv' }); }); Constrains resizing to within the bounds of the container div HTML <div id="container" style="border: 3px solid black; height: 300px; width: 300px; padding:5px"> <div id="redDiv" class="divClass" style="background-color: red"> Red Div </div> </div> jQuery $('#redDiv').resizable({ containment: '#container' });
Views: 13758 kudvenkat
Parallax Image Scrolling
 
01:52
This is a video of my web programming work in HTML. This is a work called parallax image where the content moves while the image stays the same for awhile. I put up a website where the HTML code shown in this video is and be allowed for editing through other developers and improve their own work. But if some of you want me to do this feature of web programming in your websites, order my services at this link: https://www.fiverr.com/towcal/perform-custom-web-programming?funnel=2fad7238-1e19-4ca0-97bb-1f0779c9befe. The web code for this parallax image scrolling are these lines: _______________________________________________________ !DOCTYPE html html head style body, html { height: 100%; } .parallax { /* The image used */ background-image: url('https://otakukart.com/animeblog/wp-content/uploads/2017/10/son_goku_ultra_instinct_form_by_rmehedi-dbpwu2b.png'); /* Full height */ height: 500px; /* Create the parallax scrolling effect */ background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; } .parall { /* The image used */ background-image: url('http://media.comicbook.com/2017/10/goku-ultra-instinct-vs-jiren-dragon-ball-super-1037687.jpg'); /* Full height */ height: 500px; /* Create the parallax scrolling effect */ background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; } /style /head body div class="parallax"/div div style="height:200px;background-color:red;font-size:36px" Seeing this bar moving down but the picture stays the same for awhile. /div div class="parallax"/div div class="parall"/div div style="height:200px;background-color:red;font-size:36px" Seeing this bar moving down but the picture stays the same for awhile. /div div class="parall"/div /body /html _____________________________________________________________ See my other videos of coding work and subscribe to them: https://www.youtube.com/channel/UCdhZjVbM-pS3sL1iqtjyDgQ Check out my wordpress website: https://teachexceltrick.wordpress.com/about/ Check out my fiverr gigs to get your own web codes added to your sites: https://www.fiverr.com/towcal
Views: 52 streawalk
Gravity Forms Tutorial 2018 | How to Make Gravity Forms Look Great
 
12:33
In this video I will show you how to style gravity forms using CSS to look nice, also using a function to hide form headings. Code is below: /* Add this to functions.php to remove field headings*/ add_filter( 'gform_enable_field_label_visibility_settings', '__return_true' ); Use these pre made CSS classes to make each field go in halfs gf_left_half Gf_right_half Source: https://www.gravityforms.com/css-ready-classes/ CSS for Contact Form, Submit Button & Error/Confirmation messages /* This is styling the Contact Form Button */ #gform_submit_button_1 { color: #fff; background-color: #00A759; border: 1px solid transparent !important; cursor: pointer; outline: none; text-align: center; text-decoration: none; background-image: none !important; padding: 7px 50px 7px 50px; font-size: 18px; font-family: Source Sans Pro,sans-serif; font-weight: 400; -webkit-transition-duration: 1.0s; /* Safari */ transition-duration: 1.0s; border-radius: 3px; } /* This is styling the Contact Form Button */ #gform_submit_button_1:hover { background-color: #4cc18a; /* Green */ color: white; } /* This is styling the contact form */ body #gform_wrapper_1 { border: 1px solid red ; border-radius: 10px; padding: 15px; border: 1px solid #bbb; border-top-color: rgb(187, 187, 187); border-top-style: solid; border-top-width: 1px; border-right-color: rgb(187, 187, 187); border-right-style: solid; border-right-width: 1px; border-bottom-color: rgb(187, 187, 187); border-bottom-style: solid; border-bottom-width: 1px; border-left-color: rgb(187, 187, 187); border-left-style: solid; border-left-width: 1px; } /* This removes margins from the top rows of the form */ #field_1_1, #field_1_2, #field_1_3, #field_1_5 { margin-top: 0px; } /* This centres the button in my contact form */ div.gform_footer.top_label { text-align: center; } /* This makes the error text on my form white instead of red */ .gform_wrapper div.validation_error, .gform_wrapper .validation_message, #gform_confirmation_message_1 { color: #ffffff; font-size: 18px; padding: 10px 10px 10px 10px; text-align: center; }
Views: 400 Rhys Hughes
HTML video tutorial - 27 - html hr tag
 
09:49
html hr tag: hr tag is unpaired and block level tag we use hr tag to insert horizontal lines in a web page. hr tag has various attributes like size, width, color. color attribute: is used to apply color to horizontal line, takes color name or hex color value. . width attribute: is used to set width of the horizontal line, takes values in pixel or percentage. size attribute: is used to set the thickness of the horizontal line in pixels. ======================================================== Follow the link for next video: https://youtu.be/R72N-B-cpfo Follow the link for previous video: https://youtu.be/u3Wt1stcWt8 ========= For more benefits & Be up to date =================== Subscribe to "chidres tech tutorials" channel: it's free Visit to Chidre's Tech Tutorials website: https://www.chidrestechtutorials.com Like the Facebook fan page: https://www.facebook.com/ManjunathChidre ======================================================== ========== HTML Questions & Answers ====================== 1. Which HTML tag is used to insert a horizontal line? a. hr b. line c. br d. tr Answer: a 2. The size attribute of HTML hr tag indicates: a. width of horizontal line b. thickness of horizontal line c. depth of horizontal line Answer: b ========================================================
Views: 10553 Chidre'sTechTutorials
How To Change Selected HTML Table Row Background Color Using Javascript [ with Source code ]
 
13:56
Changing the color of selected row on click in javascript Source Code: http://1bestcsharp.blogspot.com/2017/03/javascript-change-selected-html-table-row-background-color.html Javascript Tutorials For Beginners ➜ http://bit.ly/2k7NMWq Javascript Course ➜ http://bit.ly/2IvBCFC visit our blog https://1bestcsharp.blogspot.com/ subscribe: http://goo.gl/nRjPKk In This Javascript Tutorial we will see How To Change BackGround Color Of The Selected HTML Table TR On Row Click Using JS In Netbeans Editor . Javascript Tutorials : How to get value of selected radio button https://www.youtube.com/watch?v=uzwUBDQfpkU How to append Value to an array https://www.youtube.com/watch?v=KVdY8n6lCy4 javascript images slider 1 https://www.youtube.com/watch?v=QkcemPr4xaU Convert String To Number https://www.youtube.com/watch?v=JMfZG7o_QtE JavaScript Show And Hide Input Password Text https://www.youtube.com/watch?v=Cmo9sjx5eFE change div class name in js https://www.youtube.com/watch?v=X_SDJxKI6HE using checkbox with js https://www.youtube.com/watch?v=yFYEHSh2iTQ get And Set Value To An Input https://www.youtube.com/watch?v=AfRHl3soLDg calculate two numbers https://www.youtube.com/watch?v=oDUjP4N_MtQ Search Element In Array https://www.youtube.com/watch?v=LIsjSMr9bJU Add Search Remove Array Element https://www.youtube.com/watch?v=ppLbuVWf6zM Add HTML Table Row https://www.youtube.com/watch?v=FVSfp8yT8lA Get Mouse Position https://www.youtube.com/watch?v=LVi5DN2vtdo Show Text Letter By Letter https://www.youtube.com/watch?v=dbdYazO4IZ4
Views: 10375 1BestCsharp blog
jQuery disabled selector
 
04:29
Link for all dot net and sql server video tutorial playlists https://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1 Link for slides, code samples and text version of the video http://csharp-video-tutorials.blogspot.com/2015/04/jquery-disabled-selector.html In this video we will discuss 1. jQuery disabled selector 2. jQuery enabled selector 3. Where you can find jquery selectors documentation Selects all disabled elements $(':disabled') Selects all disabled elements and sets a 3px solid red border [html] [head] [title][/title] [script src="jquery-1.11.2.js"][/script] [script type="text/javascript"] $(document).ready(function () { $(':disabled').css('border', '3px solid red'); }); [/script] [/head] [body style="font-family:Arial"] [table] [tr] [td]First Name [/td] [td][input type="text" disabled="disabled" /][/td] [/tr] [tr] [td]Last Name [/td] [td][input type="text" disabled="disabled" /][/td] [/tr] [tr] [td]Email [/td] [td][input type="text" /][/td] [/tr] [tr] [td]Gender [/td] [td] [select id="selectGender" disabled="disabled"] [option value="Male"]Male[/option] [option value="Female"]Female[/option] [/select] [/td] [/tr] [tr] [td]Comments[/td] [td][textarea][/textarea][/td] [/tr] [tr] [td colspan="2"] [input type="submit" value="Submit" disabled="disabled"/] [/td] [/tr] [/table] [/body] [/html] Selects all input elements that are disabled and sets a 3px solid red border [script type="text/javascript"] $(document).ready(function () { $('input:disabled').css('border', '3px solid red'); }); [/script] Selects all input elements with type=text that are disabled and sets a 3px solid red border [script type="text/javascript"] $(document).ready(function () { $('input[type="text"]:disabled').css('border', '3px solid red'); }); [/script] Selects all enabled elements $(':enabled') Selects all enabled textarea elements and sets a 3px solid red border [script type="text/javascript"] $(document).ready(function () { $('textarea:enabled').css('border', '3px solid red'); }); [/script] Where can you find jquery selectors documentation https://api.jquery.com/category/selectors
Views: 54949 kudvenkat
HTML LINK TEXT COLOR CHANGE
 
04:51
You can change the default colors, by using styles An unvisited link is text color and Background color A visited link is text color Background color An active link is text color Background color -~-~~-~~~-~~-~- Please watch: "Flash Motion Clauds Animation" https://www.youtube.com/watch?v=cjVht5521vg -~-~~-~~~-~~-~-
Views: 3264 Supreme Son bkmrm
HTML Tutorials for Beginners 6 -  Paragraphs in HTML
 
05:22
html paragraph, html paragraph style, html paragraph size, html paragraph tag tutorial, html paragraph align, html paragraph color, html paragraph position, html paragraphs side by side, html paragraph spacing, html paragraph code, html paragraph border, html paragraph tag, html paragraph next to each other, html paragraph attributes, html css paragraph, html paragraph margin, html paragraph side by side html paragraph html paragraph tag html paragraph spacing html paragraph indent html paragraph style html paragraph width html paragraph line spacing html paragraph new line html paragraph align html paragraph padding html paragraph border html paragraph break html paragraph formatting html paragraph attributes html paragraph auto spacing html paragraph auto line break html paragraph alternative html paragraph and line breaks html paragraph attributes style html paragraph and image html paragraph align vertical html paragraph after table a paragraph html indent a paragraph html center a paragraph html bold a paragraph html style a paragraph html make a paragraph html name a paragraph html link a paragraph html hide a paragraph html underline a paragraph html html paragraph bold html paragraph box html paragraph block html paragraph break wordpress html paragraph break code html paragraph border color html paragraph background colour html paragraph bgcolor html paragraph color html paragraph center html paragraph code html paragraph class html paragraph css html paragraph color red html paragraph content html paragraph character html paragraph columns html paragraph character limit html paragraph definition html paragraph double space html paragraph different color html paragraph design html paragraph display inline html paragraph default display html paragraph does not wrap html paragraph distance html paragraph default margin html paragraph div html paragraph element html paragraph example html paragraph enter html paragraph editor html paragraph ellipsis html paragraph empty space html paragraph editable html paragraph events html paragraph element javascript html paragraph end tag html paragraph font size html paragraph formatting justify html paragraph font bold html paragraph font face html paragraph filler html paragraph float right html paragraph fill width html paragraph first line indent html paragraph font italic html paragraph generator html paragraph gap html paragraph get text html paragraph gradient html paragraph getelementbyid html give paragraph id online html paragraph generator html paragraph code generator html paragraph style generator lorem ipsum html paragraph generator html paragraph height html paragraph header html paragraph hanging indent html paragraph hidden html paragraph horizontal align html paragraph hyperlink html paragraph highlight html paragraph href html paragraph horizontal center html paragraph h1 html paragraph id html paragraph input html paragraph indent all lines html paragraph indent first line html paragraph inline html paragraph inside list item html paragraph input box html paragraph italic html paragraph indent second line html paragraph justify html paragraph justify css html paragraph justify alignment html paragraph javascript html paragraph jump change html paragraph javascript html paragraph right justify html paragraph center justify html paragraph text jquery html paragraph keep formatting html keep paragraph together kode html paragraph html paragraph line break html paragraph left align html paragraph link html paragraph list html paragraph left margin html paragraph line html paragraph length html paragraph left and right html paragraph language html paragraph margin html paragraph max width html paragraph mark html paragraph margin left html paragraph margin top html paragraph multiple lines html paragraph max length html paragraph middle html paragraph maker html paragraph multiple styles html paragraph next line html paragraph no line break html paragraph not wrapping html paragraph next to image html paragraph next to each other html paragraph no spacing html paragraph name html paragraph numbering html paragraph not working n in paragraph html html paragraph onclick html paragraph overflow html paragraph on same line html paragraph options html paragraph over image html paragraph one line html paragraph offset html paragraph or break html paragraph outline html paragraph onload html paragraph properties html paragraph position html paragraph padding left html paragraph padding top html paragraph placeholder html paragraph preserve line breaks html paragraph padding bottom html paragraph position center html paragraph padding right html p paragraph html p paragraph spacing html p space between paragraphs html paragraph quote html paragraph return html paragraph right align html paragraph red color html paragraph remove space after html paragraph rounded corners html paragraph right
Views: 2308 T3SO Tutorials
1972 Plymouth Roadrunner Milford CT Stratford, CT #2G104757 - SOLD
 
00:41
http://www.napoliclassics.com/ SOLD - Phone: 203-668-7797 Year: 1972 Make: Plymouth Model: Roadrunner Engine: 440 C.I. Transmission: Manual Color: Tor Red Interior: Black Mileage: 51015 Stock #: 2G104757 style type="text/css" !-- #napoli-container { background-color: #000; color: #FFF; font-weight: bold; font-family: Arial, Helvetica, sans-serif; text-align: left; } #napoli-title { font-size: x-large; padding: 12px; text-align: center; text-transform: uppercase; } #napoli-subtitle { font-size:x- large; text-align: left; text-transform: uppercase; } #napoli-box { width: 550px; margin: 0 auto; padding: 15px; border-width: 3px; border-color: #FFF; border-style: solid; text-align: left; } #napoli-vitals { font-size: large; text-align: left; padding-top: 0px; padding-left: 15px; line-height: 1.3em; color: white } #napoli-boxtitle { font-size: x-large; text-align: center; padding-top: 10px; padding-bottom: 10px; padding-left: 5px; text-transform: uppercase; } #napoli-contact { font-size: x-large; text-align: center; padding: 15px 0px 55px; } -- /style div id="napoli-container" div id="napoli-title" span style="color:red;line-height:150%;" 1972 PLYMOUTH ROADRUNNERbr 440 C.I. 4 SPEEDbr FRAME OFF RESTORATIONbr RARE ONLY 906 MADEbr /span /div br / br / div id="napoli-box" div id="napoli-vitals" YEAR: 1972br MAKE: PLYMOUTHbr MODEL: ROADRUNNERbr BODY: 2 DOOR HARDTOPbr COLOR: TOR REDbr TRIM: BLACKbr ENGINE: 440 C.I. 4 BBLbr TRANSMISSION: 4 SPEEDbr REAR: 3.55 SURE GRIPbr MILES: 51015br SERIAL #: RM23P2C104757br /div /div br / br / div id="napoli-boxtitle"span style="color:red;"OPTIONS/span/div div id="napoli-box" div id="napoli-vitals" * 440 C.I. 4 BBLbr * 4 SPEED WITH PISTOL GRIP SHIFTERbr * BUCKET SEATS AND C Napoli Motors, located in Milford, CT has been family owned and operated since 1959.Our commitment to family values makes us a popular choice throughout Fairfield and New Haven Counties.Come let us show you why. At Napoli Motors we pride ourselves on our commitment to outstanding customer service.We will ensure that you get the car you want at a competitive price, we will give you top dollar for your trade in and we will work with you on financing plus get worry free car buying with Napoli's 30 day or 1500 mile exchange policy. Address: 241 Boston Post Rd Milford CT Stratford, CT 06460
Views: 396 Napoli Classics
CSS Placeholder Color (Quick tutorial)
 
02:07
This video will show you how to change the input and textarea's placeholder text color with css. Follow Us Facebook: http://bit.ly/2srBAX7 Twitter: http://bit.ly/2tAEvgG Instagram: http://bit.ly/2tbfnKn placeholder color | html input placeholder | change placeholder color | style placeholder text | textarea placeholder | placeholder text color Subscribe to us : https://www.youtube.com/channel/UCaU1VsZaFQ1hHq8P2dGrJMw?sub_confirmation=1 How to disable someone from copying texts in your website: https://www.youtube.com/watch?v=a2MS1jd9M_w How to properly add background image with CSS: https://www.youtube.com/watch?v=dfqR3sEnj6k How to center a div inside a div: https://www.youtube.com/watch?v=RCoQOS4s5ls How to create unordered list without bullets: https://www.youtube.com/watch?v=_KXobsfRlPQ
Views: 7079 garnatti one
How to change the background colour of a webpage in HTML
 
03:12
Hello Guys! How are you doing? Hope all are fine.. In this video you will learn how to change the color of the background of a webpage in HTML. This can be done by two ways - the body bgcolor way , and the style way. Both ways are explained properly and shown. You can learn more such things by checking out our channel for more Tutorials of HTML. I hope you learnt a heck lot of things in this video.. It would be a great deal of support if you guys would Subscribe, Like, and Comment. You can also ask your doubts and get satisfying answers by our Experts. You can contact us at [email protected] or leave a message. You can also ask your questions on our site www.alphixia.weebly.com I sincerely Thank You for watching this and I hope that Alphixia has helped you. We will keep helping , as we think it is our religion to help people! Thanks! Nick - Co Owner
Views: 62988 Alphixia
HTML Tutorial (Urdu-Hindi) | Part-8 | HTML Color Values
 
10:09
HTML Color Codes: rgb(red,green,blue) rgba(red,green,blue,alpha) rgb(0,0,0) rgb(255,0,0) rgb(0,255,0) rgb(0,0,255) rgb(255,255,255) Please see complete video for HTML Color values tag. Facebook:- https://www.facebook.com/tips.tricks.71465 Youtube:- https://www.youtube.com/channel/UCXxwu1pTzTVyF2NFVJ9gmEg Google Plus: https://plus.google.com/u/0/107040258162375223893 Twitter:- https://twitter.com/tipsntricks1977 PS: Don't forget to SUBSCRIBE "Bangash Academy" channel for more Trusted & Awesome videos. Thanks: SHB
Views: 57 Bangash Academy

Doxycycline 100mg for rosacea
Specialistica ambulatoriale caserta graduatoria 2013 chevy
Generic nexum without prescription
Udzire 100mg viagra
Mua nitro tech