#html basics
Explore tagged Tumblr posts
gifpeanutbutter · 14 years ago
Text
GIF Peanut Butter: Tutorial: HTML Basics
PART 1: Simple Text Options
When you want to bold something you are writing about, simply adding "<b>my bold text</b>" to any page that accepts HTML will allow the bold tag to load. Replace "my bold text" with the words you want bolded.
Italics work the same way: "<i>italics, italics, italics</i>" would look like: "italics, italics, italics" If I published the "<li></li>" tags (in Tumblr or another HTML editor for a website).
To underline your text: "<u>underlined text</u>" = "underlined text" when published.
Simple right? <b>bold</b>, <i>italics</i>, <u>underlined</u> ;)
PART 2: Line Breaks and Dividing/Horizontal Lines
Typing "<br>" at anytime in an HTML document creates a line break, causing the text to pick up on the following line once you publish the page (even if you continue typing right after the "<br>" tag). With the "<br>" tag, you do not have to worry about an ending tag such as "</br>" -- it's not necessary.
Making horizontal lines is possible with a simple "<hr>" tag (horizontal line) and also does not need a closing tag to publish. When you use the "<hr>" tag in an HTML page it will create a line that divides your content (generally black or grey by default). To add color to the dividing line: "<hr color="blue">". Replace "blue" with another HTML-friendly color. Here's a list of HTML color names.
PART 3: Making Your Own Links
Although Tumblr gives you the chance to add links with just a click of a button, some of you might be working on other websites and blogs. Making a link is super simple and just requires a bit of practice to memorize the method. "<a href="http://www.thesiteiamlinkingto.com">The text my link says when users click on it</a>" is a basic link tag. Copy and paste it to use it anywhere that accepts HTML.
PART 4: Adding Graphics Manually
Adding images to your website or blog:
1.) Go to Imgur.com (or another free photo host such as imageshack.us or photobucket.com) 2.) Click on upload image[s], and search your computer for the image file name that you want to put in your blog. 3.) Once the image has been uploaded, look for a “direct” or “image” link: 4.) Copy the link that ends in “.gif” “.bmp” “.jpg” “.jpeg” “.png” etc. 5.) Use the following code: <img src=”PUT YOUR LINK TO THE IMAGE HERE THAT ENDS IN .GIF OR .JPG, ETC.”> 6.) Go to your blog and select “Customize Appearance” and add the code within your description — Or within the “Edit HTML” section if you have advanced coding knowledge of CSS.
PART 5: Making Lists
Making HTML lists is a bit more complicated than traditional HTML tags, but don't let it scare you away--it's only a BIT more complicated and in all honesty, it's all about being able to memorize the order of tags, that's all. Making lists is a way to share likes, interests and other categorized items on websites in an ordered fashion.
Basic Lists:
"<ul>
<li>list item #1</li>
<li>list item #2</li>
<li>list item #3</li>
</ul>" will look like:
list item #1
list item #2
list item #3
when it's saved and published. The "<ul>" starts the list and is the main HTML tag. The "<li>" tags allow you to list individual items, while the "</li>" tags help to close each bullet with each individual item you type. Closing the list is possible by using a "</ul"> tag at the end to complete the proper format.
Numbered/Ordered Lists:
"<ol>
<li>list item #1</li>
<li>list item #2</li>
<li>list item #3</li>
</ol>" will look like:
list item #1
list item #2
list item #3
The only difference in the numbered/ordered list code is changing the "<ul>" and "</ul>" codes to "<ol>" and "</ol>" (ordered list).
PART 6: Changing HTML Font Colors
Although there are much easier ways of changing HTML font colors (by using CSS style sheets), you have another option for simple editors including Tumblr if you're not interested in working with your layout's code (tutorials on that later). When you want to change some text colors on your page use this code:
<font color="red">my font my text</font> wherever you want your font color to change. (Here's a list of HTML color names.) = "my font my text" (will look red) when it's live.
*note: some layouts may disable your own custom HTML--so be sure to check with different layouts before working on the code for hours!
If you enjoyed this tutorial, follow gifpeanutbutter for 1000's of GIFs and other types of free tutorials ^_^.
234 notes · View notes
thebrokerlist · 13 years ago
Text
Learn HTML for CRE - A New Second Language
Tumblr media
HTML is an acronym for Hypertext Markup Language and it is truly the new way to write for the web today. HTML gives you the code that displays in browsers. For instance, we have displayed the most common and basic html below. This short list packs a powerful punch for anyone in CRE or any business for that matter.
Today our text and images and do many things to drive traffic where you want it to go. Also, the format of the text can help to enhance our written word, like strong to make our text bold and emphasized to make text italic.
In addition our use of html, it can also create powerful automation, like mailto: links. For instance, if you use a mailto: link on a HAVE or WANT post it can help you to see where that person clicked from to send you an email! If you take the mailto: link code and add a subject line specific to a property and even some text in the body, it may help your viewer or sender save much time as well.
Say the property headline is 1,500 SF Houston ABC Tower. That headline can be made into the subject line of the mailto: link. Now when the viewer clicks on Send More Information, the email will contain 1,500 SF Houston ABC Tower and you will know exactly what it pertains to. The same holds true for sources of email. If you know the email is from a certain website or a blog post, you can add whatever will help you to know the source of that click, just by using a simple mailto: link!!
The same holds true for the body of the email. If you use body= inside your mailto: link, that same email can contain this message in the body:
Please send me more information on the 1,500 SF Houston ABC Tower.
Here are some examples of basic html that everyone in commercial real estate should be aware of. There will be a test later so study up and use these simple html tools on your own profile and posts!
Text Link
<a href="url">Link text</a> <a href="http://thebrokerlist.com">theBrokerList</a> will result in theBrokerList.
Image Link
<a href="mailto:[email protected]?Subject=Join%20Us">Send Mail</a> will result in Send Mail. (click it!!) Note that you need to insert %20 between words for the subject line word spacing!!  
Body Content and Subject Line
<a href="mailto:[email protected]?&subject=Update%20Your%20Profile&body=Your%20Profile%20Is%20Important-%20Keep%20It%20Current! ">Send mail!</a> Send Mail
Basic Text Formats
This text is big  <big> text </big>
This text is emphasized <em> text </em>
This is subscript and superscript <sub> text </sub> <sup> text </sup>
This text is bold <strong> text </strong>
Basically, by adding the beginning tag <tag > and ending tag </tag> with the description around your text or sentence, you can enhance the presentation of your written word. Do not fret when things do not work out exactly as you believe they should on all sites. There are browsers, programs and websites that permit certain types of html, while other sites do not permit any html. Get to know what sites permit what types of html so you can make your written word or property listings look as professional as possible.
Start to notice this terminology on blog comment systems. Some blog comments permit the use of html as well. Comments are a tremendous way to build credibility in CRE or any industry you are in. For instance, if you follow an industry blog and have some insight or feedback for the author, adding html provides more information about you and leads the readers to your content as well.
The other advantage to understanding the basics of html is SEO. For instance, if you want to build credibility for the topic about Arizona CRE, it would be a good idea to use a keyphrase of Arizona Commercial Real Estate Brokers, but make it a text hyperlink to that web content or your profile or listing or blog! So it would be a text hyperlink like this: Arizona Commercial Real Estate Brokers! Take it slow and use reference sites like w3schools to hone your skills! Whenever you need to learn how to use html, just visit w3schools and it walks you through step by step from the most basics to some complex concepts. By following the examples, you learn by doing. It is educational and a fun way to learn.
Each day we see so many members post static text and we are so frustrated to see our industry not take this baby-step to learning more about how the internet, browsers and search really functions. Knowing just a small amount of html can really help your SEO. Our goal is not to make you a geek or change your business, we just want to share these points to help your SEO and improve your search results. If you need ideas or help, just ask and we can share some pointers for your profiles and posts. Remember, each one of us offer unique experiences, expertise, clients, geographies and property types that we specialize in. Focus on what makes you special and highlight it. Take keywords and keyphrases that are meaningful to you and use them throughout your promotions for yourself, your firm and your clients! Do not waste all of this valuable real estate we now call "the internet!" Do not over do the use of hyperlinks, however, but use them thoughtfully and carefully!
55 notes · View notes
Text
basic html
In case anyone is confused how to format with the new update, here is some basics of html
<b>text</b> To bold
<u>text</u> To underline
<i>text</i> To italicise
<h1>text</h1> to have a heading
<ul>list</ul> to have an unorded list
<ol>list</ol> to have an orderd list
<li>text</li> have list items within the list
<a href="url">text</a> link
<img src="image url">
<br /> line break
<hr> horizontal line
<p>text</p> paragraph
<strike>text</strike> strikethrough text
<blockquote>text</blockquote> that line indendt thingy
There you go, html basics. Hope it helps! :)
15 notes · View notes
truereligionstitched · 13 years ago
Photo
Tumblr media
Hong Kong Street Style…VIA blogger #CarmenChan, http://himys.com/ GET THE LOOK
13 notes · View notes
rcswebdesign · 14 years ago
Video
youtube
Folder Structure
6 notes · View notes
theds106shrink · 10 years ago
Photo
Tumblr media Tumblr media Tumblr media
Well, working with the ancient code for The Village web club has led to this shrink going back to basics. I kind of need to do more than just copy and paste code I do not understand, so learning HTML from scratch. Still,  my little hideaway under the village is coming along. I even managed to learn how to do strikethrough in ancient code (not trivial as we are working with HTML 3 as I understand it)  HT to Christina for pointing me to the Code Academy. It was easy to get started and get going. I want to understand something about the overall structure of a web page, else I am never going to be able to make my village hideaway cosy and comfy. 
“I just love his idea of introducing this space as one folks who are creating on the web and pushing to teach themselves new things within a focused community might explore together. It’s fun, it’s personable, it’s focused, and it’s educational!”
Yes, Jim. You are on the money and John is finally getting me to do more than just copy and paste code I kind of understand but not really! Cheers, John!
We could create a text based adventure game underground?
3 notes · View notes
webtutorsblog · 2 years ago
Text
Looking to master the basics of HTML? WebTutor offers a comprehensive guide to help you navigate the world of HTML with ease. From understanding tags to building web pages, this tutorial is perfect for beginners. Start your journey to becoming an HTML pro today at WebTutor!
1 note · View note
binaypedia · 4 years ago
Text
Basic Introduction to HTML - BinayPedia
Basic Introduction to HTML – BinayPedia
Introduction to HTML HTML – Hypertext Mark-up Language is used to create web pages along with CSS, and JavaScript. Basic Introduction to HTML Basic Introduction to HTML HTML use to interpret and compose text, images, and other material into visual or audible web pages or simply used to provide content for the website. HTML mark-up consists of several keys called tags, HTML tags most commonly…
Tumblr media
View On WordPress
1 note · View note
gracereunilla-blog · 9 years ago
Text
Anatomy of a Page
<!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <p>hello, world</p> </body> </html>
See that? That's what a basic HTML skeleton looks like. We are using the HTML5 Doctype, which means that our HTML code follows the basic minimum requirements for being a web page.
Step 1: DOCTYPE
Think of your Doctype as a declaration of what kind of file your document will be. It's case-insensitive, so you can use either !DOCTYPE HTML, !doctype html, or !DOCTYPE html, whatever you prefer. I personally use what's in the example.
Now, your basic HTML file will always be in sections (until we get to more advanced stuff like templating and partials, but we have a ways yet to go). Your html tag wraps around your entire document, which brings me to opening and closing tags.
Aside: Opening and Closing Tags
Most HTML elements (yes, things inside <> brackets are called elements) will have an opening and closing tag. Notice how "hello, world" is wrapped in <p> tags? Those are paragraph tags. The opening and closing tags are simply to contain content. Some elements won't have an opening and closing tag, like the Doctype. These elements are called empty elements, because they don't contain content. The <img src="src" alt="image"> (image) and <br> (line break) tags are other empty elements.
Step 2: The 3 Components of a Page
As I said earlier, the element wraps around the page. Inside the element are the and elements, which will always be the two main elements you'll need.
HEADs Up!
Inside your tags will be your page and eventually your CSS stylesheet link references. Later on you'll learn about elements like <meta> tags and how they're useful for making your web page mobile-friendly.
The Body Element (aka the fun part)
Everything that you'll see on your web page so far will live inside your `` element. In the example above, there's nothing more than our paragraph tag.
Coming Up: Basic Tags and CSS
I know this wasn't much of a tutorial but more of an explanation of parts. We've just moved in to our new Web House! The next post will be about basic HTML elements, or our furniture for our little house, and I'll introduce you to CSS, your interior designer.
Stay tuned.
1 note · View note
vipercute-blog · 9 years ago
Text
Tooltips
(small box that shows when you hover over a link) EX:
Paste this code under <head> or before </head>
Paste this code under <style type=“text/css”> or before </style>
To make a link have a title when hovered, format the link like this:
You can change the colors/font size/borders/etc. under #s-m-t-tooltip (code in step 2)
1 note · View note
mycodediary-blog · 11 years ago
Text
HTML Basics
HTML Headings HTML headings are defined with the <h1> to <h6> tags
<h1>This is a heading</h1> <h2>This is a heading</h2> <h3>This is a heading</h3>
HTML Paragraphs HTML paragraphs are defined with the <p> tags
<p>This is a paragraph.</p> <p>This is another paragraph.</p>
HTML Links HTML links are defined with the <a> tag.
<a href="http://yourdomainname.com">This is a link</>
HTML Images HTML images are defined with the <img> tag.
<img src="yourimage.jpg" alt="yourdomainname.com" width="_" height="_">
1 note · View note
bittutech · 1 month ago
Text
This beginner-friendly blog post introduces you to HTML, the fundamental building block of the web.
0 notes
ivccseap · 2 years ago
Text
HTML HAND WRITTEN NOTES
Html HAND WRITTEN Notes
View On WordPress
0 notes
webtutorsblog · 2 years ago
Text
Want to upgrade your coding skill to create animations and interactive graphics? This blog covers everything about HTML animation including the Canvas API.
0 notes
tutorialsexample-blog · 6 years ago
Link
HTML Interview Questions with tutorial and examples on HTML, CSS, JavaScript, XHTML, Java, .Net, PHP, C, C++, Python, JSP, Spring, Bootstrap, jQuery, Interview Questions etc.
0 notes
najahpro-blog · 6 years ago
Text
Recent HTML 5 boot camp 2019
Recent HTML 5 boot camp 2019
Learn html 5 from basics till advancing
What you’ll learn :
html basics (how to make a paragraph – title -insert an image – make a link – list – table ……….) learn html 5 tags like (audio – video) how to make a login, signup forms or any kind of forms learn inline CSS some other tricks in html
Description :
Html 5 course which explain html from scratch and everything in html.
-The course starts…
View On WordPress
0 notes