Eesyy's Posts
Nairaland Forum › Eesyy's Profile › Eesyy's Posts
1 2 3 4 5 6 7 8 ... 10 11 12 13 14 15 16 (of 16 pages)
*The HTML Style Attribute* Remember we established Attributes as additional information placed in opening tags to cause the element display in different manners. The style Attribute and style sheet do the same thing: they allow you the programmer to 'style' elements the way you want them to appear giving the page an overall defined outlook; they provide beauty and layout to the web page. Setting the style of an HTML element, can be done with the style attribute. The HTML style attribute has the following syntax: style="property:value;" The property is a CSS property. The value is a CSS value. At this point you would want to ask want is CSS? That is a topic for later and we will expound on it at the appropriate time. Let's apply the syntax mentioned above. *HTML Background Color* The background-color property defines the background color for an HTML element; example below. *HTML Text Color* The color property defines the text color for an HTML element; example below. *HTML Fonts* The font-family property defines the font to be used for an HTML element; example below. *HTML Text Size* The font-size property defines the text size for an HTML element, units can be in percentage or pixels; example below. *HTML Text Alignment The text-align property defines the horizontal text alignment for an HTML element to left, right or center; example below. This example sets the background for a page to yellow, both headers centred while the colour of first header is red, the first paragraph is in Verdana font, second and third paragraph are formatted in text sizes to 160 percent and 17 pixels respectively: <body style="background-color: yellow;"> <h1 style="color: red; text-align: center;" >This is a heading</h1> <p style="font-family: verdana;">This is a paragraph.</p> <p style="font-size: 160%;">This is another paragraph.</p> <h2 style="text-align: center;"> Sub-heading </h2> <p style="font-size: 17px;"> New paragraph</p> </body> Your page should appear on your browser like what you see in the image uploaded below. This is a peek into styling a web page which is really interesting. Now you have an idea what style sheets and style attribute can do. Pay around with the properties and values for a bit. It's quite fun to learn, easy as breathing. Powered by Programmers Community...
|
You must have observe that no matter the spaces you create between text using the space bar, your browser translates all to one (a single space character). Also you would have noticed that without using the <br/> element you can not break to another line. For example try this and check the result on your browser: <!DOCTYPE html> <html> <head> <title>Formatting Text Example</title> </head> <body> <p> I am a man. I am a son. I am a father. I am a friend. </p> </body> </html> See? All the extra spaces are automatically removed by your browser as what you see in the first uploaded image below. That is how it reads your HTML document. It is correct! However you can "force" your browser to display text the way you have formatted it in your HTML code, by using the <pre> element. It is called preformatted text. Try the above example again, this time using this element: <!DOCTYPE html> <html> <head> <title>Formatting Text Example</title> </head> <body> <pre> I am a man. I am a son. I am a father. I am a friend. </pre> </body> </html> Hmmm!!! Yes, that's what you get; something like what you see in the second uploaded image below. That's nice, right? You can try using this element- <pre> - again and again, it won't change what it does. It keeps preformatted text i.e. retains the format of your text in your HTML code. Really cool. Powered by Programmers Community...
|
You must have observe that no matter the spaces you create between text using the space bar, your browser translates all to one (a single space character). Also you would have noticed that without using the <br/> element you can not break to another line. For example try this and check the result on your browser: <!DOCTYPE html> <html> <head> <title>Formatting Text Example</title> </head> <body> <p> I am a man. I am a son. I am a father. I am a friend. </p> </body> </html> See? All the extra spaces are automatically removed by your browser as what you see in the first uploaded image below. That is how it reads your HTML document. It is correct! However you can "force" your browser to display text the way you have formatted it in your HTML code, by using the <pre> element. It is called preformatted text. Try the above example again, this time using this element: <!DOCTYPE html> <html> <head> <title>Formatting Text Example</title> </head> <body> <pre> I am a man. I am a son. I am a father. I am a friend. </pre> </body> </html> Hmmm!!! Yes, that's what you get; something like what you see in the second uploaded image below. That's nice, right? You can try using this element- <pre> - again and again, it won't change what it does. It keeps preformatted text i.e. retains the format of your text in your HTML code. Really cool. Powered by Programmers Community...
|
mike272:Does anyone else think so too? Your opinions...
|
*HTML – FORMATTING* If you use a word processor, you must be familiar with the ability to make text bold, italicized, or underlined; these are just three of the ten options available to indicate how text can appear in HTML and XHTML. *Bold, Italic and Underlined Texts* Anything that appears within <b>...</b>element, is displayed in bold, while that appears within <i>...</i> element is displayed in italicized. Anything that appears within <u>...</u> element, is displayed with underline as in example shown below. *Strike Text* Anything that appears within <strike>...</strike>element is displayed with strikethrough, which is a thin line through the text as in example shown below. *Monospaced Font* The content of a <tt>...</tt> element is written in monospaced font. Most of the fonts are known as variable-width fonts because different letters are of different widths (for example, the letter 'm' is wider than the letter 'i'). In a monospaced font, however, each letter has the same width. *Superscript and Subscript Texts* The content of a <sup>...</sup> element is written in superscript; the font size used is the same size as the characters surrounding it but is displayed half a character's height above the other characters.The content of a <sub>...</sub> element is written in subscript; the font size used is the same as the characters surrounding it, but is displayed half a character's height beneath the other characters. *Inserted and Deleted Texts* Anything that appears within <ins>...</ins> element is displayed as inserted text. Anything that appears within <del>...</del> element, is displayed as deleted text. *Larger and Smaller Texts* The content of the <big>...</big> element is displayed one font size larger than the rest of the text surrounding it while the content of the <small>...</small> element is displayed one font size smaller than the rest of the text surrounding it as in example shown below. <!DOCTYPE html> <html> <head> <title>Formatting Text Example</title> </head> <body> <p>The following word uses a <b>bold</b>typeface.</p> <p>The following word uses a <i>italicized</i>typeface.</p> <p>The following word uses a <u>underlined</u> typeface.</p> <p>The following word uses a <s>strikethrough</s> typeface.</p> <p>The following word uses a <tt>monospaced</tt> typeface.</p> <p>The following word uses a <sup>superscript</sup> typeface.</p> <p>The following word uses a <sub>subscript</sub> typeface.</p> <p>I want to drink <del>cola</del> <ins>wine</ins>.</p> <p>The following word uses a <big>big</big> typeface.</p> <p>The following word uses a <small>small</small> typeface.</p> </body> </html> The below uploaded image shows what your browser result should look like. *Grouping Content* The <div> and <span> elements allow you to group together several elements to create sections or subsections of a page. For example, you might want to put all of the footnotes on a page within a <div> element to indicate that all of the elements within that <div> element relate to the footnotes. You might then attach a style to this <div> element so that they appear using a special set of style rules. This might sound like gibberish right now, but it will become clearer when we talk about style sheet. Powered by Programmers Community...
|
Good day dear readers, I did not write a post yesterday, yes! We'll take it as a lunch break from the classroom. Well we back to work now, I hope you guys had a fulfilled time, and I trust you are fueled and fired up for the next lap. It's getting intense. So gear up and enjoy the journey. It's good to be back. ~Programmers Community... |
*HTML – FORMATTING* If you use a word processor, you must be familiar with the ability to make text bold, italicized, or underlined; these are just three of the ten options available to indicate how text can appear in HTML and XHTML. *Bold, Italic and Underlined Texts* Anything that appears within <b>...</b>element, is displayed in bold, while that appears within <i>...</i> element is displayed in italicized. Anything that appears within <u>...</u> element, is displayed with underline as in example shown below. *Strike Text* Anything that appears within <strike>...</strike>element is displayed with strikethrough, which is a thin line through the text as in example shown below. *Monospaced Font* The content of a <tt>...</tt> element is written in monospaced font. Most of the fonts are known as variable-width fonts because different letters are of different widths (for example, the letter 'm' is wider than the letter 'i'). In a monospaced font, however, each letter has the same width. *Superscript and Subscript Texts* The content of a <sup>...</sup> element is written in superscript; the font size used is the same size as the characters surrounding it but is displayed half a character's height above the other characters.The content of a <sub>...</sub> element is written in subscript; the font size used is the same as the characters surrounding it, but is displayed half a character's height beneath the other characters. *Inserted and Deleted Texts* Anything that appears within <ins>...</ins> element is displayed as inserted text. Anything that appears within <del>...</del> element, is displayed as deleted text. *Larger and Smaller Texts* The content of the <big>...</big> element is displayed one font size larger than the rest of the text surrounding it while the content of the <small>...</small> element is displayed one font size smaller than the rest of the text surrounding it as in example shown below. <!DOCTYPE html> <html> <head> <title>Formatting Text Example</title> </head> <body> <p>The following word uses a <b>bold</b>typeface.</p> <p>The following word uses a <i>italicized</i>typeface.</p> <p>The following word uses a <u>underlined</u> typeface.</p> <p>The following word uses a <s>strikethrough</s> typeface.</p> <p>The following word uses a <tt>monospaced</tt> typeface.</p> <p>The following word uses a <sup>superscript</sup> typeface.</p> <p>The following word uses a <sub>subscript</sub> typeface.</p> <p>I want to drink <del>cola</del> <ins>wine</ins>.</p> <p>The following word uses a <big>big</big> typeface.</p> <p>The following word uses a <small>small</small> typeface.</p> </body> </html> The below uploaded image shows what your browser result should look like. *Grouping Content* The <div> and <span> elements allow you to group together several elements to create sections or subsections of a page. For example, you might want to put all of the footnotes on a page within a <div> element to indicate that all of the elements within that <div> element relate to the footnotes. You might then attach a style to this <div> element so that they appear using a special set of style rules. This might sound like gibberish right now, but it will become clearer when we talk about style sheet. Powered by Programmers Community...
|
Good day dear readers, I did not write a post yesterday, yes! We'll take it as a lunch break from the classroom. Well we back to work now, I hope you guys had a fulfilled time, and I trust you are fueled and fired up for the next lap. It's getting intense. So gear up and enjoy the journey. It's good to be back. ~Programmers Community... |
RHAPSODY OF REALITIES DAILY DEVOTIONA MONDAY 31ST AUGUST 2020 PST. CHRIS IT’S ALL PART OF GOD’S PLAN Do not conform yourselves to the standards of this world, but let God transform you inwardly by a complete change of your mind. Then you will be able to know the will of God—what is good and is pleasing to him and is perfect (Romans 12:2 GNB). As a Christian, every person who comes into your world has a role to play, whether good or bad. You’ll surely come across different kinds of people in your journey of life. No matter how they relate with you, recognise that God has placed them along your path for your benefit. It doesn’t make any difference whether they’re helpful or hostile; their relationship with you is part of God’s plan to promote you. Once you understand this, you’ll be happy and grateful to God for anyone who comes into your world. A playwright once said, “All the world is a stage, and all the men and women merely players; they have their entrances and their exits, and one man in his time plays many parts.” Your only concern should be to please your heavenly Father. Don’t get concerned about the wrongs done to you; ignore the negative actions, comments or ill-treatments from others. Only respond in love to those who hurt or despitefully use you. The highest and topmost quality of God’s character is living out His love in you, for the Bible says _*“…the love of God is shed abroad in our hearts by the Holy Ghost which is given unto us” (Romans 5:5). You’re a testimony of the Father’s love, and your life is an outshining of that great love—unconditional and self-giving. Hallelujah! CONFESSION It makes no difference how I’m treated by anyone, I respond only in love and kindness, because the love of God has been shed in abundance in my heart by the Holy Spirit. Every day and in all circumstances, I’m living out that love in me that the Name of Jesus may be glorified. Amen FURTHER STUDY Matthew 5:43-48 Ye have heard that it hath been said, Thou shalt love thy neighbour, and hate thine enemy. 44 But I say unto you, Love your enemies, bless them that curse you, do good to them that hate you, and pray for them which despitefully use you, and persecute you; 45 That ye may be the children of your Father which is in heaven: for he maketh his sun to rise on the evil and on the good, and sendeth rain on the just and on the unjust. 46 For if ye love them which love you, what reward have ye? do not even the publicans the same? 47 And if ye salute your brethren only, what do ye more than others? do not even the publicans so? 48 Be ye therefore perfect, even as your Father which is in heaven is perfect. _We trust you have been blessed by this devotional. We invite you to make Jesus Christ the Lord of your life by praying thus:_ *_“O Lord God, I believe with all my heart in Jesus Christ, Son of the living God. I believe He died for me and God raised Him from the dead. I believe He’s alive today. I confess with my mouth that Jesus Christ is the Lord of my life from this day. Through Him and in His Name, I have eternal life; I’m born again. Thank you Lord, for saving my soul! I’m now a child of God. Hallelujah!”_* Let us know that you made that declaration by sending a mail to info@rhapsodyofrealities.org DAILY SCRIPTURE READING 1-YEAR BIBLE READING PLAN 1 Corinthians 15:1-34 & Proverbs 5-7 2-YEAR BIBLE READING PLAN 1 Thessalonians 2:1-9 & Jeremiah 17 *Stay blessed*
|
*RHAPSODY OF REALITIES DAILY DEVOTIONAL* SATURDAY 29TH AUGUST 2020 PST. CHRIS STAY FOCUSED ON THE WORD "Looking unto Jesus the author and finisher of our faith… (Hebrews 12:2)." The Amplified Classic translation of our opening verse says, “Looking away [from all that will distract] to Jesus….” What God is telling you here is simple: stay focused on the Word! Jesus is the incarnate Word; fix your gaze on Him; don’t get distracted. Recall the case with Peter and the Master when they walked on the sea; Peter began to sink when he took his focus off Jesus. If he had kept his gaze on the Master, he wouldn’t have been overwhelmed by the billowing waves and tempest (read Matthew 14:25-31). The same thing happens to many today; when they allow themselves to be overwhelmed by problems and circumstances instead of focussing on the Word of God, they sink even further. There’s no situation you can’t handle successfully with the Word of God. Make the Word of God your stay; live in the Word! Learn from Jesus; He lived the Word, even though He is the Word! He was focused, and was never distracted from the Word. He looked at the result of His faith; for the joy that was set before Him He endured the Cross, despising the shame. He didn’t care what people thought about Him; His focus was to carry out the will of the Father. It should be the same with you. They may call you names because of your devotion and dedication to the Lord, but don’t let that affect you. If anything, be inspired to love Him more; be challenged to serve Him even more passionately. Don’t be moved by hard times and turbulent circumstances; hold on tight, with your focus on Jesus. 1Timothy 6:12 says, “Fight the good fight of faith, lay hold on eternal life….” Don’t turn away from the Word. Isaiah 26:3 reveals part of the result of keeping your focus on God’s Word; the Lord will keep you in the peace of prosperity: “Thou wilt keep him in perfect peace, whose mind is stayed on thee: because he trusteth in thee.” *CONFESSION* The Word of God is producing results in me by the power of God’s Spirit as I walk in my heritage in Christ! I experience the peace of prosperity because I live in God’s Word! I’m unflustered by tests, trials, and persecutions, because the Word makes me triumphant always. Hallelujah! *FURTHER STUDY:* Hebrews 4:12 For the word of God is quick, and powerful, and sharper than any twoedged sword, piercing even to the dividing asunder of soul and spirit, and of the joints and marrow, and is a discerner of the thoughts and intents of the heart. Isaiah 55:10-11 For as the rain cometh down, and the snow from heaven, and returneth not thither, but watereth the earth, and maketh it bring forth and bud, that it may give seed to the sower, and bread to the eater: So shall my word be that goeth forth out of my mouth: it shall not return unto me void, but it shall accomplish that which I please, and it shall prosper in the thing whereto I sent it. *DAILY SCRIPTURE READING* 1-YEAR BIBLE READING PLAN 1 Corinthians 13 & Proverbs 1-2 2-YEAR BIBLE READING PLAN Colossians 4:10-18 & Jeremiah 15 *Stay blessed*
|
*The title Attribute* The title attribute gives a suggested title for the element. The syntax for the title attribute is similar as explained for id attribute. The behavior of this attribute will depend upon the element that carries it, although it is often displayed as a tooltip when cursor comes over the element or while the element is loading. Try this: . . . <h3 title="Hello HTML!">Titled Heading Tag Example</h3> . . . Now try to bring your cursor over "Titled Heading Tag Example" and you will see that whatever title you used in your code is coming out as a tooltip of the cursor. *The class Attribute* The class attribute is used to associate an element with a style sheet, and specifies the class of element. You will learn more about the use of the class attribute when you will learn Cascading Style Sheet (CSS). So for now you can avoid it. The value of the attribute may also be a space-separated list of class names. For example: . . . <p class="newclass1 anotherclass"> This paragraph is set as the heading below. </p> <br/> <h3 class="newclass1"> This heading is set as the above paragraph. </h3> . . . *The style Attribute* The style attribute allows you to specify Cascading Style Sheet (CSS) rules within the element for example: . . . <p style="font-family:arial; color:#FF0000;">Some text...</p> . . . At this point of time, we are not learning CSS, so just let's proceed without bothering much about CSS. Here, you need to understand what HTML attributes are and how they can be used while formatting content. *Single or Double Quotes?* Double style quotes are the most common in HTML, but single style can also be used. In some situations, when the attribute value itself contains double quotes, it is necessary to use single quotes or vice versa: . . . <h3 id="newid"> Heading </h3> <p title='tooltip'> Paragraph </p> . . . *Generic Attributes* Here's a table of some other attributes that are readily usable with many of the HTML tags right in the uploaded picture below. We will see related examples as we will proceed to study other HTML tags Powered by Programmers Community...
|
*HTML – ATTRIBUTES* We have seen few HTML tags and their usage like heading tags <h1>, <h2>, paragraph tag <p>and other tags. We used them so far in their simplest form, but most of the HTML tags can also have attributes, which are extra bits of information. An attribute is used to define the characteristics of an HTML element and is placed inside the element's opening tag. All attributes are made up of two parts: a name and a value: 1. The name is the property you want to set. For example, the paragraph <p>element in the example carries an attribute whose name is align, which you can use to indicate the alignment of paragraph on the page. 2. The value is what you want the value of the property to be set and always put within quotations. The below example shows three possible values of align attribute: left, center and right. Attribute names and attribute values are case-insensitive. However, the World Wide Web Consortium (W3C) recommends lowercase attributes/attribute values in their HTML 4 recommendation. Example: <!DOCTYPE html> <html> <head> <title>Align Attribute Example</title> </head> <body> <p align="left">This is left aligned</p> <p align="center">This is center aligned</p> <p align="right">This is right aligned</p> </body> </html> The four core attributes that can be used on the majority of HTML elements (although not all) are: 1. Id 2. Title 3. Class 4. Style *The Id Attribute* The id attribute of an HTML tag can be used to uniquely identify any element within an HTML page. There are two primary reasons that you might want to use an id attribute on an element: 1. If an element carries an id attribute as a unique identifier, it is possible to identify just that element and its content. 2. If you have two elements of the same name within a Web page (or style sheet), you can use the id attribute to distinguish between elements that have the same name. We will discuss style sheet in separate tutorial. For now, let's apply the id attribute to distinguish between two paragraph elements as shown below. . . . <p id="html">This para explains what is HTML.</p> <p id="css">This para explains what is Cascading Style Sheet.</p> . . . Powered by Programmers Community...
|
*The title Attribute* The title attribute gives a suggested title for the element. The syntax for the title attribute is similar as explained for id attribute. The behavior of this attribute will depend upon the element that carries it, although it is often displayed as a tooltip when cursor comes over the element or while the element is loading. Try this: . . . <h3 title="Hello HTML!">Titled Heading Tag Example</h3> . . . Now try to bring your cursor over "Titled Heading Tag Example" and you will see that whatever title you used in your code is coming out as a tooltip of the cursor. *The class Attribute* The class attribute is used to associate an element with a style sheet, and specifies the class of element. You will learn more about the use of the class attribute when you will learn Cascading Style Sheet (CSS). So for now you can avoid it. The value of the attribute may also be a space-separated list of class names. For example: . . . <p class="newclass1 anotherclass"> This paragraph is set as the heading below. </p> <br/> <h3 class="newclass1"> This heading is set as the above paragraph. </h3> . . . *The style Attribute* The style attribute allows you to specify Cascading Style Sheet (CSS) rules within the element for example: . . . <p style="font-family:arial; color:#FF0000;">Some text...</p> . . . At this point of time, we are not learning CSS, so just let's proceed without bothering much about CSS. Here, you need to understand what HTML attributes are and how they can be used while formatting content. *Single or Double Quotes?* Double style quotes are the most common in HTML, but single style can also be used. In some situations, when the attribute value itself contains double quotes, it is necessary to use single quotes or vice versa: . . . <h3 id="newid"> Heading </h3> <p title='tooltip'> Paragraph </p> . . . *Generic Attributes* Here's a table of some other attributes that are readily usable with many of the HTML tags right in the uploaded picture below. We will see related examples as we will proceed to study other HTML tags Powered by Programmers Community...
|
*HTML – ATTRIBUTES* We have seen few HTML tags and their usage like heading tags <h1>, <h2>, paragraph tag <p>and other tags. We used them so far in their simplest form, but most of the HTML tags can also have attributes, which are extra bits of information. An attribute is used to define the characteristics of an HTML element and is placed inside the element's opening tag. All attributes are made up of two parts: a name and a value: 1. The name is the property you want to set. For example, the paragraph <p>element in the example carries an attribute whose name is align, which you can use to indicate the alignment of paragraph on the page. 2. The value is what you want the value of the property to be set and always put within quotations. The below example shows three possible values of align attribute: left, center and right. Attribute names and attribute values are case-insensitive. However, the World Wide Web Consortium (W3C) recommends lowercase attributes/attribute values in their HTML 4 recommendation. Example: <!DOCTYPE html> <html> <head> <title>Align Attribute Example</title> </head> <body> <p align="left">This is left aligned</p> <p align="center">This is center aligned</p> <p align="right">This is right aligned</p> </body> </html> The four core attributes that can be used on the majority of HTML elements (although not all) are: 1. Id 2. Title 3. Class 4. Style *The Id Attribute* The id attribute of an HTML tag can be used to uniquely identify any element within an HTML page. There are two primary reasons that you might want to use an id attribute on an element: 1. If an element carries an id attribute as a unique identifier, it is possible to identify just that element and its content. 2. If you have two elements of the same name within a Web page (or style sheet), you can use the id attribute to distinguish between elements that have the same name. We will discuss style sheet in separate tutorial. For now, let's apply the id attribute to distinguish between two paragraph elements as shown below. . . . <p id="html">This para explains what is HTML.</p> <p id="css">This para explains what is Cascading Style Sheet.</p> . . . Powered by Programmers Community...
|
*Nested HTML Elements It is very much allowed to keep one HTML element inside another HTML element: Example: the file below is called nesting.html for sake of reference. <!DOCTYPE html> <html> <head> <title>Nested Elements Example</title> </head> <body> <h1>This is <i>italic</i> heading</h1> <p>This is <u>underlined and <b>bold </b> </u> paragraph</p> </body> </html> Consider elements as bowls with lids, the bowls being the opening tags, the lids being the closing tags. When you place a small bowl in a large one, you cover the small bowl first with its own life before covering the big bowl. The small bowl might be holding something inside like a spoon, the big bowl might be holding something else like water apart from the small bowl you placed inside. Now you can carry the big bowl and drop it into a bigger bowl e.g a basket and cover the basket. The basket could be carrying fruits also. This analogy explains elements nesting. From the above example, take the h1 element as the big bowl and the i element as the small bowl: i carries the text 'italic' while placed inside h1. But before <h1> is closed with its closing tag </h1>, you see <i> is closed first with its own closing tag </i>. Meanwhile h1 element carries text aside the i element inside it. After h1 is p in the same example. P is a bigger bowl; a basket with fruits which is the text inside of it and also another bowl not as big; the u element also with text and a smaller bowl; the b element. The small bowl <b> is first closed with its closing tag </b> to hold its text content, then comes the lid of the <u>, its own closing tag </u> to cover all of its content, text included. The closing tag of <p> comes last which is </p> holding everything together. So what is NESTING? This is an order of placing elements inside other elements rightly. If you do the example below, you would be wrong: <!DOCTYPE html> <html> <head> <title>Nested Elements Example</title> </head> <body> <h1>This is <i>italic</h1> heading</i> <p>This is <u>underlined and <b>bold </p> </u> paragraph</b> </body> </html> Just because an element is opened first doesn't mean it gets closed first. No! Every element inside it is housed by it. So it must be closed last to start and end after those elements inside it has been closed appropriately. Nesting is quite easy to get right. *Don't Forget the End Tag* Some HTML elements will display correctly, even if you forget the end tag, but DO NOT rely on this. It might produce unexpected results and/or errors if you forget the end tag. *Empty HTML Elements* HTML elements with no content are called empty elements. <br> is an empty element without a closing tag (the <br> tag defines a line break). Empty elements can be "closed" in the opening tag like this: <br />, <hr/> HTML5 does not require empty elements to be closed. But if you want stricter validation, or you need to make your document readable by XML parsers, you should close all HTML elements. *HTML Tip: Use Lowercase Tags* HTML tags are not case sensitive: <P> means the same as <p>. The HTML5 standard does not require lowercase tags, but W3C recommends lowercase in HTML4, and demands lowercase for stricter document types like XHTML. W3C means world wide web consortium. XML means eXtendable Markup Language XHTML means eXtendable Hyper Text Markup Language. You can look these up on google, you will learn somethings. Next up: HTML ATTRIBUTES. Powered by Programmers Community...
|
*Nested HTML Elements It is very much allowed to keep one HTML element inside another HTML element: Example: the file below is called nesting.html for sake of reference. <!DOCTYPE html> <html> <head> <title>Nested Elements Example</title> </head> <body> <h1>This is <i>italic</i> heading</h1> <p>This is <u>underlined and <b>bold </b> </u> paragraph</p> </body> </html> Consider elements as bowls with lids, the bowls being the opening tags, the lids being the closing tags. When you place a small bowl in a large one, you cover the small bowl first with its own life before covering the big bowl. The small bowl might be holding something inside like a spoon, the big bowl might be holding something else like water apart from the small bowl you placed inside. Now you can carry the big bowl and drop it into a bigger bowl e.g a basket and cover the basket. The basket could be carrying fruits also. This analogy explains elements nesting. From the above example, take the h1 element as the big bowl and the i element as the small bowl: i carries the text 'italic' while placed inside h1. But before <h1> is closed with its closing tag </h1>, you see <i> is closed first with its own closing tag </i>. Meanwhile h1 element carries text aside the i element inside it. After h1 is p in the same example. P is a bigger bowl; a basket with fruits which is the text inside of it and also another bowl not as big; the u element also with text and a smaller bowl; the b element. The small bowl <b> is first closed with its closing tag </b> to hold its text content, then comes the lid of the <u>, its own closing tag </u> to cover all of its content, text included. The closing tag of <p> comes last which is </p> holding everything together. So what is NESTING? This is an order of placing elements inside other elements rightly. If you do the example below, you would be wrong: <!DOCTYPE html> <html> <head> <title>Nested Elements Example</title> </head> <body> <h1>This is <i>italic</h1> heading</i> <p>This is <u>underlined and <b>bold </p> </u> paragraph</b> </body> </html> Just because an element is opened first doesn't mean it gets closed first. No! Every element inside it is housed by it. So it must be closed last to start and end after those elements inside it has been closed appropriately. Nesting is quite easy to get right. *Don't Forget the End Tag* Some HTML elements will display correctly, even if you forget the end tag, but DO NOT rely on this. It might produce unexpected results and/or errors if you forget the end tag. *Empty HTML Elements* HTML elements with no content are called empty elements. <br> is an empty element without a closing tag (the <br> tag defines a line break). Empty elements can be "closed" in the opening tag like this: <br />, <hr/> HTML5 does not require empty elements to be closed. But if you want stricter validation, or you need to make your document readable by XML parsers, you should close all HTML elements. *HTML Tip: Use Lowercase Tags* HTML tags are not case sensitive: <P> means the same as <p>. The HTML5 standard does not require lowercase tags, but W3C recommends lowercase in HTML4, and demands lowercase for stricter document types like XHTML. W3C means world wide web consortium. XML means eXtendable Markup Language XHTML means eXtendable Hyper Text Markup Language. You can look these up on google, you will learn somethings. Next up: HTML ATTRIBUTES. Powered by Programmers Community...
|
RHAPSODY OF REALITIES DAILY DEVOTIONAL FRIDAY 28TH AUGUST 2020 PST. CHRIS HE BEARS YOU UP. Likewise the Spirit also helpeth our infirmities: for we know not what we should pray for as we ought: but the Spirit Himself maketh intercession for us with groanings which cannot be uttered (Romans 8:26). There’re times you may be confronted with so many predicaments that you wonder, “How am I supposed to pray about all of these problems?” The truth is, if you decide to pray about every problem or issues around you one after the other, you may spend eternity on your knees. Moreover, you may not even remember all of them. But the good news is, God doesn’t expect you to carry your own burden. The Bible says, _*“Casting all your care upon him; for he careth for you”*_ (1 Peter 5:7). In fact, He doesn’t expect you to pray about your problems, because you don’t even know about all of them. So how do you handle them? It’s part of the reasons He gave you the Holy Spirit. The Holy Spirit bears you up in the time of weakness or limitation. When you don’t know what to do, what to pray for or how to go about a certain situation, He steps in. God gave us the Holy Spirit to guide us in all situations of life. When it comes to dealing with everyday problems, the same Holy Spirit stands in the gap (intercedes) for us as read in our theme verse. He takes charge in our behalf. Be ever conscious and yielded to the ministry of the Holy Spirit in your personal life. Here prays through you with groanings and deep sighs which can’t be uttered in articulate speech, making intercession for you according to the will of God. This is why it’s important that you pray often in other tongues; it helps you to activate your spirit and give vent to the divine utterances of the Holy Spirit. When you pray through your spirit, you inevitably address every necessary issue in your life that needs attention. The psalmist remarked, _*“The LORD will perfect that which concerneth me…”*_ (Psalm 138: . As you pray in the Spirit, the Lord would indeed put everything that concerns you into shape, even those things that you’re unaware of. You only need to trust Him with your life, realising that He’s big enough and willing to take care of you. Blessed be His Name forever!PRAYER Dear loving Father, thank you for the extraordinary ministry of your Spirit who imparts to me the knowledge of your will concerning issues of importance, and helps me pray aright, causing circumstances to align with your perfect will for me and my loved ones, in Jesus’ Name. Amen. FURTHER STUDY: 1 Corinthians 14:2 For he that speaketh in an unknown tongue speaketh not unto men, but unto God: for no man understandeth him; howbeit in the spirit he speaketh mysteries. Romans 8:26 Likewise the Spirit also helpeth our infirmities: for we know not what we should pray for as we ought: but the Spirit itself maketh intercession for us with groanings which cannot be uttered. 8:27 And he that searcheth the hearts knoweth what is the mind of the Spirit, because he maketh intercession for the saints according to the will of God. Jude 1:20 But ye, beloved, building up yourselves on your most holy faith, praying in the Holy Ghost, DAILY SCRIPTURE READING 1-YEAR BIBLE READING PLAN 1 Corinthians 12 & Psalms 146-150 2-YEAR BIBLE READING PLAN Colossians 4:1-9 & Jeremiah 14 *Stay blessed*
|
*HTML Tags* As told earlier, HTML is a markup language and makes use of various tags to format the content. These tags are enclosed within angle braces <Tag Name>. Except few tags, most of the tags have their corresponding closing tags. For example, <html>has its closing tag</html>and <body>tag has its closing tag </body>tag etc. To learn HTML, you will need to study various tags and understand how they behave, while formatting a textual document. Learning HTML is simple as users have to learn the usage of different tags in order to format the text or images to make a beautiful webpage. World Wide Web Consortium (W3C) recommends to use lowercase tags starting from HTML 4. We have talked some concerning tags and elements especially those that are essential for a proper html document structure: DOCTYPE declaration, html, head, title and body, including some more like the h1, p and br. From our examples, we have seen how they perform when used. We will continue by mentioning more of these tags and elements. *Horizontal Lines* Horizontal lines are used to visually break-up sections of a document. The <hr> tag creates a line from the current position in the document to the right margin and breaks the line accordingly. Again <hr> tag is an example of the empty element, where you do not need opening and closing tags, as there is nothing to go in between them. For example where you already have a html web document, within the body element you can write: <! DOCTYPE html> <html> <head> <title> Tags and Elements </title> </head> <body> <h2> Here Again </h2> <hr> <p> Here is the paragraph text following the header above. Check me out. There is an horizontal line above me. </p> </body> </html> Try the above, save the file, open in a browser and take a screenshot of the browser result, then upload here. *HTML Images* HTML images are defined with the <img> tag. The source file (src), alternative text (alt), and size (width and height) are provided as attributes. You will learn more about attributes later. For now, try using the same html file from the above example. But first copy a picture to the same location where your html document file is and rename the picture as 'sample'. Also check out the properties of the picture to make sure the type is jpg. <! DOCTYPE html> <html> <head> <title> Tags and Elements </title> </head> <body> <h2> Here Again </h2> <hr> <p> Here is the paragraph text following the header above. Check me out. There is an horizontal line above me. </p> <img src="sample.jpg" alt="picture example" width="104" height="142"> </body> </html> Notice in the src attribute of the img element the value is same as the name of the picture 'sample' and there is a '.jpg' after the name, which tells the browser to look for a jpg file named sample in the same location as the html file document. Jpg here is the file type and extension. If when you checked the picture properties and saw a different file type like png or jpeg, then in the src attribute we would have to write "sample.png" or "sample.jpeg" respectively depending on which is the picture file type. You can try this out now and upload a screenshot of your browser result here too. We need to track our progress as we go on. That's the way to know how much we know actually and can do. This is meant to be practical, not all talk and read. So let's be co-operative, thanks so much. We shall learn about nested elements next. Till I write again, stay well! Powered by Programmers Community...
|
*HTML Tags* As told earlier, HTML is a markup language and makes use of various tags to format the content. These tags are enclosed within angle braces <Tag Name>. Except few tags, most of the tags have their corresponding closing tags. For example, <html>has its closing tag</html>and <body>tag has its closing tag </body>tag etc. To learn HTML, you will need to study various tags and understand how they behave, while formatting a textual document. Learning HTML is simple as users have to learn the usage of different tags in order to format the text or images to make a beautiful webpage. World Wide Web Consortium (W3C) recommends to use lowercase tags starting from HTML 4. We have talked some concerning tags and elements especially those that are essential for a proper html document structure: DOCTYPE declaration, html, head, title and body, including some more like the h1, p and br. From our examples, we have seen how they perform when used. We will continue by mentioning more of these tags and elements. *Horizontal Lines* Horizontal lines are used to visually break-up sections of a document. The <hr> tag creates a line from the current position in the document to the right margin and breaks the line accordingly. Again <hr> tag is an example of the empty element, where you do not need opening and closing tags, as there is nothing to go in between them. For example where you already have a html web document, within the body element you can write: <! DOCTYPE html> <html> <head> <title> Tags and Elements </title> </head> <body> <h2> Here Again </h2> <hr> <p> Here is the paragraph text following the header above. Check me out. There is an horizontal line above me. </p> </body> </html> Try the above, save the file, open in a browser and take a screenshot of the browser result, then upload here. *HTML Images* HTML images are defined with the <img> tag. The source file (src), alternative text (alt), and size (width and height) are provided as attributes. You will learn more about attributes later. For now, try using the same html file from the above example. But first copy a picture to the same location where your html document file is and rename the picture as 'sample'. Also check out the properties of the picture to make sure the type is jpg. <! DOCTYPE html> <html> <head> <title> Tags and Elements </title> </head> <body> <h2> Here Again </h2> <hr> <p> Here is the paragraph text following the header above. Check me out. There is an horizontal line above me. </p> <img src="sample.jpg" alt="picture example" width="104" height="142"> </body> </html> Notice in the src attribute of the img element the value is same as the name of the picture 'sample' and there is a '.jpg' after the name, which tells the browser to look for a jpg file named sample in the same location as the html file document. Jpg here is the file type and extension. If when you checked the picture properties and saw a different file type like png or jpeg, then in the src attribute we would have to write "sample.png" or "sample.jpeg" respectively depending on which is the picture file type. You can try this out now and upload a screenshot of your browser result here too. We need to track our progress as we go on. That's the way to know how much we know actually and can do. This is meant to be practical, not all talk and read. So let's be co-operative, thanks so much. We shall learn about nested elements next. Till I write again, stay well! Powered by Programmers Community...
|
Roadyroadie:Awesome of you to say something. Thanks. To all followers, do the work to know the steps and how much you can actually do, else the journey stops even before it begins and you would have only amassed large quantities of head knowledge; nothing practice-able. Track your progress, communicate your results here, if you please. Your experience starts now, especially in this training. Be practical everytime. It's in your wisdom to do these. I respect you all, Programmers-In-Training, soon Programmers-To-Teach. You guys are great. It takes guts and will, that I know. Thumbs up... |
RHAPSODY OF REALITIES DAILY DEVOTIONAL THURSDAY 27TH AUGUST 2020 PST. CHRIS GODLINESS WITH CONTENTMENT [And it is indeed, a source of immense profit, for] godliness accompanied with contentment (that contentment which is a sense of inward sufficiency) is great and abundant gain (1 Timothy 6:6 AMPC) The Bible defines contentment for us in our opening verse as “a sense of inward sufficiency”; then it says that “godliness accompanied with contentment is great and abundant gain.” Paul, by the Spirit, further writes, “For we brought nothing into the world, and obviously we cannot take anything out of the world; But if we have food and clothing, with these we shall be content (satisfied). But those who crave to be rich fall into temptation and a snare and into many foolish (useless, godless) and hurtful desires that plunge men into ruin and destruction and miserable perishing” (1 Timothy 6:7-9 AMPC). This is the ordeal of those who struggle to be rich. But you shouldn’t get into that dilemma as a child of God, because being born again, you’ve entered into a life of contentment. You’ve ceased from your struggles and the glory of God now works within you. The Bible says in 2 Corinthians 8:9, “For ye know the grace of our Lord Jesus Christ, that, though he was rich, yet for your sakes he became poor, that ye through his poverty might be rich.” And in Proverbs 10:22, it says, “The blessing of the LORD, it maketh rich, and he addeth no sorrow with it.” This is your life as a child of God! God’s inherent blessing in your life is the basis for your riches. Your prosperity is inherited through the Spirit, because you’re the seed of Abraham. In Christ, you have entered into God’s rest. You no longer worry over your rent and other bills. As Abraham’s seed, you’re ever aglow, full of praise and giving glory to God. Function from a place of inward sufficiency, and operate from a vantage position of rest and satisfaction, irrespective of circumstances. No matter the situation, be full of joy; continue to praise, serve the Lord, and delight yourself in Him. He’ll create the opportunities for you to keep making progress from glory to glory. CONFESSION Dear Lord Jesus, I acknowledge you as the Lord of my life; you’re the Lord over my choices, desires, plans, and purposes. Always and at all times, I function from a place of inward sufficiency, and operate from a vantage position of rest and satisfaction, irrespective of circumstances. Hallelujah! FURTHER STUDY Hebrews 4:10 For he that is entered into his rest, he also hath ceased from his own works, as God did from his. 2 Corinthians 9:8 AMPC And God is able to make all grace (every favor and earthly blessing) come to you in abundance, so that you may always and under all circumstances and whatever the need be self-sufficient [possessing enough to require no aid or support and furnished in abundance for every good work and charitable donation]. _We trust you have been blessed by this devotional. We invite you to make Jesus Christ the Lord of your life by praying thus:_ *_“O Lord God, I believe with all my heart in Jesus Christ, Son of the living God. I believe He died for me and God raised Him from the dead. I believe He’s alive today. I confess with my mouth that Jesus Christ is the Lord of my life from this day. Through Him and in His Name, I have eternal life; I’m born again. Thank you Lord, for saving my soul! I’m now a child of God. Hallelujah!”_* Let us know that you made that declaration by sending a mail to info@rhapsodyofrealities.org 1 YEAR BIBLE READING PLAN 1 Corinthians 11:2-34 & Psalms 142-145 2 YEAR BIBLE READING PLAN Colossians 3:12-25 & Jeremiah 13 *stay blessed*
|
Just to reiterate, web design is about having a curious mind, patient and attentive to details. This is true and vital. It's easier for those using a laptop or desktop to code. Yes! you can code with smaller devices: your tablet or phone. If you can download the necessary applications on the device you can. Sublime text for mobile is a really cool application you can use especially if you are already familiar with the desktop version. However, you can use very easily and comfortably the Quoda application, or QuickEdit. These two are great for anyone. Clearly, we have gradually approached the 'technical' web design. If you have been practical with this thread, you must have created a simple web page. You can be proud of yourself now, there's however much more to travel, you must know that. The web page we created was made up of little parts known as elements. Remember this, <h1> Heading </h1>? It is an h1 element holding the text 'Heading' which displayed as a big bold text on the web page. We would have been able to make it appear smaller in size, using a slightly different element like h2. That is writing something like this: <h2> Heading </h2>. Try that and see the result when you reload the web page on your browser. You can still reduce it further, infact 4 more times using h3, h4, h5 and h6 elements, like this: <h3> Heading </h3> <br> <h4> Heading </h4> <br> <h5> Heading </h5> <br> <h6> Heading </h6> Notice how on your web browser, the sizes reduce progressively as you go from h1 to h6? These are elements used to write out headers on a web page, you can determine the size and importance of the header using any one of the elements from h1 to h6, h1 being the biggest and most important while h6 being the smallest and least important. That means if you use h2 for a heading, whatever sub-heading comes under it becomes h3, h5, h5 or h6 depending on your want, but not h1, because h2 comes after h1 in their order of precedence (size and importance). Also looking at the code, you notice another element <br>. It represents a single line break. You use it to discontinue a line and can break down text leaving spaces of lines between them. If you type: <h3> My Heading </h3> <br><br><br> <h3> Another Heading </h3> you are going to have 3 blank lines in between both headings. These are just two of the many html elements that come in handy to create anything on a web page. There are however, some necessary elements that make up a web page, before the introduction of any other element. We have used them in our first example: <!DOCTYPE html> <html> <head> <title> </title> </head> <body> </body> </html> Looks familiar? This is the structure of an html web page, and will display a blank page on any browser. Compare this with the code from the first example. Notice the text between <title> and </title>, and the other elements written between <body> and </body>, from the first example? The title text displays on your browsers title bar (tab) while the text on your browser window is as a result of the elements in the html document body. Everything in the body of your html page displays on your browser window. The head element holds information about the web page necessary for the correct interpretation of the page by you the user and the browser. These two: head and body are the two distinct parts of an html page. They hold every other element, and are held together by the html element which is defines where the html document begins and ends: <html> ... ... . . . </html> Before anything else I would like you to know the definition of HTML. HTML stands for Hypertext Markup Language, and it is the most widely used language to write Web Pages. Hypertext refers to the way in which Web pages (HTML documents) are linked together. Thus, the link available on a webpage is called Hypertext. As its name suggests, HTML is a Markup Language which means you use HTML to simply "mark-up" a text document with tags that tell a Web browser how to structure it to display. A markup language is a set of markup tags HTML documents are described by HTML tags. Each HTML tag describes different document content. The tags make up the elements. Most elements have an opening and a closing tag e.g <html>, <head>, <body>, <h1>, <h3>, <p> are all opening tags while </html>, </head>, </body>, </h1>, </h3>, </p> are all closing tags. The difference is the stroke (backslash) that appears in the closing tags. Together the opening and closing tags make up the elements that define the content. There are also some elements with just one tag, like one we have used: <br>, others are <hr> and <img>. These ones can still be closed right in the opening tag like this: <br/>, <hr/>. That is the stroke (backslash) comes last in the brackets. Originally, HTML was developed with the intent of defining the structure of documents like headings, paragraphs, lists, and so forth to facilitate the sharing of scientific information between researchers. Now, HTML is being widely used to format web pages with the help of different tags available in HTML language. We will continue with tags and elements in the next post, thank you for following through to this point. Powered by Programmers Community...
|
Just to reiterate, web design is about having a curious mind, patient and attentive to details. This is true and vital. It's easier for those using a laptop or desktop to code. Yes! you can code with smaller devices: your tablet or phone. If you can download the necessary applications on the device you can. Sublime text for mobile is a really cool application you can use especially if you are already familiar with the desktop version. However, you can use very easily and comfortably the Quoda application, or QuickEdit. These two are great for anyone. Clearly, we have gradually approached the 'technical' web design. If you have been practical with this thread, you must have created a simple web page. You can be proud of yourself now, there's however much more to travel, you must know that. The web page we created was made up of little parts known as elements. Remember this, <h1> Heading </h1>? It is an h1 element holding the text 'Heading' which displayed as a big bold text on the web page. We would have been able to make it appear smaller in size, using a slightly different element like h2. That is writing something like this: <h2> Heading </h2>. Try that and see the result when you reload the web page on your browser. You can still reduce it further, infact 4 more times using h3, h4, h5 and h6 elements, like this: <h3> Heading </h3> <br> <h4> Heading </h4> <br> <h5> Heading </h5> <br> <h6> Heading </h6> Notice how on your web browser, the sizes reduce progressively as you go from h1 to h6? These are elements used to write out headers on a web page, you can determine the size and importance of the header using any one of the elements from h1 to h6, h1 being the biggest and most important while h6 being the smallest and least important. That means if you use h2 for a heading, whatever sub-heading comes under it becomes h3, h5, h5 or h6 depending on your want, but not h1, because h2 comes after h1 in their order of precedence (size and importance). Also looking at the code, you notice another element <br>. It represents a single line break. You use it to discontinue a line and can break down text leaving spaces of lines between them. If you type: <h3> My Heading </h3> <br><br><br> <h3> Another Heading </h3> you are going to have 3 blank lines in between both headings. These are just two of the many html elements that come in handy to create anything on a web page. There are however, some necessary elements that make up a web page, before the introduction of any other element. We have used them in our first example: <!DOCTYPE html> <html> <head> <title> </title> </head> <body> </body> </html> Looks familiar? This is the structure of an html web page, and will display a blank page on any browser. Compare this with the code from the first example. Notice the text between <title> and </title>, and the other elements written between <body> and </body>, from the first example? The title text displays on your browsers title bar (tab) while the text on your browser window is as a result of the elements in the html document body. Everything in the body of your html page displays on your browser window. The head element holds information about the web page necessary for the correct interpretation of the page by you the user and the browser. These two: head and body are the two distinct parts of an html page. They hold every other element, and are held together by the html element which is defines where the html document begins and ends: <html> ... ... . . . </html> Before anything else I would like you to know the definition of HTML. HTML stands for Hypertext Markup Language, and it is the most widely used language to write Web Pages. Hypertext refers to the way in which Web pages (HTML documents) are linked together. Thus, the link available on a webpage is called Hypertext. As its name suggests, HTML is a Markup Language which means you use HTML to simply "mark-up" a text document with tags that tell a Web browser how to structure it to display. A markup language is a set of markup tags HTML documents are described by HTML tags. Each HTML tag describes different document content. The tags make up the elements. Most elements have an opening and a closing tag e.g <html>, <head>, <body>, <h1>, <h3>, <p> are all opening tags while </html>, </head>, </body>, </h1>, </h3>, </p> are all closing tags. The difference is the stroke (backslash) that appears in the closing tags. Together the opening and closing tags make up the elements that define the content. There are also some elements with just one tag, like one we have used: <br>, others are <hr> and <img>. These ones can still be closed right in the opening tag like this: <br/>, <hr/>. That is the stroke (backslash) comes last in the brackets. Originally, HTML was developed with the intent of defining the structure of documents like headings, paragraphs, lists, and so forth to facilitate the sharing of scientific information between researchers. Now, HTML is being widely used to format web pages with the help of different tags available in HTML language. We will continue with tags and elements in the next post, thank you for following through to this point. Powered by Programmers Community...
|
BillShiphr:I checked out their site, they seem to have an impressive portfolio. Anyone in need of a website straight up can try them. Thanks. However for those who are interested in doing stuff with their hands maybe for personal need or for others, you should know, web design is about having a curious mind, patient and attentive to details. Please continue to enjoy the ride. Powered by Programmers Community... |
*RHAPSODY OF REALITIES* WEDNESDAY 26 *A HAPPY HEART AND A CHEERFUL MIND* Pastor Chris *A happy heart is good medicine and a cheerful mind works healing, but a broken spirit dries up the bones (Proverbs 17:22 AMPC).* A disease such as cancer draws its life from depression, bitterness, anger, resentment, malice and sadness. But laughter, which is one of the easiest, quickest and instantly recognizable expressions of joy and cheerfulness, has curative powers. If people who are sick or faced with dire circumstances in their lives would act simply on God’s Word by learning to laugh often, they’ll be amazed at the sudden change. There’re those who haven’t laughed in a long time. They’ve almost forgotten how to laugh. They look at their lives and conclude there’s nothing to be happy about. In fact, they’d feel guilty if they caught themselves laughing. They believe laughing is for those who aren’t serious about life. Yet, their stiffness hasn’t made life any easier for them. God wants you to know from His Word that laughter is a healer. Your expression of joy is a good starting point for healing and restoration. Sometimes, when life seems to get tough, learn to pull back and laugh. Have a merry heart and a cheerful mind. Interestingly, you don’t have to pray to God to give you happiness or cheerfulness; it’s a function of your recreated human spirit. You make yourself joyful with the Word of God. Remember, one of the fruits of your recreated human spirit is joy (Galatians 5:22); you’ve got joy in your spirit; and laughter and cheerfulness are expressions of joy. *CONFESSION* Irrespective of the circumstances, I’m full of joy twenty-four hours a day, for the joy of the Lord is my strength! I’ve been brought into a life of rest, with joy unspeakable and full of glory. The Lord continually fills my mouth with laughter and joy in the Holy Ghost! Glory to His Name forever! *FURTHER STUDY* Romans 14:17; Psalm 126:2; Galatians 5:22 *1 YEAR BIBLE READING PLAN*: 1 Corinthians 10:14-11:1 & Psalms 139-141 *2 YEAR BIBLE READING PLAN:* Colossians 3:1-11 & Jeremiah 12 *EXCERPT FROM:* Rhapsody of Realities Daily Devotional. App=http:///Restorehope
|
ImACow:Welcome man. Great to have a comment... There will be more to come surely. Powered by Programmers Community... |
*HTML5 &CSS 3* Since the web was first created there have been several versions of HTML and CSS — each intended to be an improvement on the previous version. I have therefore chosen to teach you these latest versions. Because HTML5 and CSS3 build on previous versions of these languages, learning these means you will also be able to understand the earlier versions of them. I have added clear notes when the code is new and also when it might not work in older browsers. *Before You Get Started* Creating HTML documents differs from creating word-processor documentsusing an application like Microsoft Word because you end uphaving to use two applications: 1. You create the Web pages in your text or HTML editor. 2. You view the results in your Web browser. Even though many HTML editors, such as Dreamweaver and HTML-Kit, provide a browser preview, it’s still important to preview your Web pages inside actual Web browsers (such as Internet Explorer, Firefox, or Safari) so you can see them as your end users do. It might feel a bit unwieldy to edit inside one application and then switch to another to look at your work, but you’ll be switching from text editor to browser and back like a pro in (almost) no time. *What Web Pages Are Made Of* Some elements are required for a well-structured HTML document. 1. The <!DOCTYPE html> declaration defines the document type to be HTML. 2. The <html></html> element describes an html document. 3. The <head></head> element carries necessary information about the document. 4. The <title></title> element describes the title of the page. You will see this on the tab of your browser's title bar for any page. 5. The <body></body> elements carries the content of the page to be displayed on the browser window. 6. The text between <h1> and </h1> describes a heading. 7. The text between <p> and </p> describes a paragraph. 8. The <br> element creates a line break, thereby discontinuing a line or giving an empty line space. Your html page should look like that in the image in the previous post. Remember how to save an html page, right? Read the section about "Choosing a location and name for your file" in the previous post. When you open it in your browser, a page like the one below should display. This means you have started coding. We will get to talk some more about the basic things involved in making a web page. Powered by Programmers Community...
|
*HTML5 &CSS 3* Since the web was first created there have been several versions of HTML and CSS — each intended to be an improvement on the previous version. I have therefore chosen to teach you these latest versions. Because HTML5 and CSS3 build on previous versions of these languages, learning these means you will also be able to understand the earlier versions of them. I have added clear notes when the code is new and also when it might not work in older browsers. *Before You Get Started* Creating HTML documents differs from creating word-processor documentsusing an application like Microsoft Word because you end uphaving to use two applications: 1. You create the Web pages in your text or HTML editor. 2. You view the results in your Web browser. Even though many HTML editors, such as Dreamweaver and HTML-Kit, provide a browser preview, it’s still important to preview your Web pages inside actual Web browsers (such as Internet Explorer, Firefox, or Safari) so you can see them as your end users do. It might feel a bit unwieldy to edit inside one application and then switch to another to look at your work, but you’ll be switching from text editor to browser and back like a pro in (almost) no time. *What Web Pages Are Made Of* Some elements are required for a well-structured HTML document. 1. The <!DOCTYPE html> declaration defines the document type to be HTML. 2. The <html></html> element describes an html document. 3. The <head></head> element carries necessary information about the document. 4. The <title></title> element describes the title of the page. You will see this on the tab of your browser's title bar for any page. 5. The <body></body> elements carries the content of the page to be displayed on the browser window. 6. The text between <h1> and </h1> describes a heading. 7. The text between <p> and </p> describes a paragraph. 8. The <br> element creates a line break, thereby discontinuing a line or giving an empty line space. Your html page should look like that in the image in the previous post. Remember how to save an html page, right? Read the section about "Choosing a location and name for your file" in the previous post. When you open it in your browser, a page like the one below should display. This means you have started coding. We will get to talk some more about the basic things involved in making a web page. Powered by Programmers Community...
|
*Creating a Page from Scratch Part 2* Step 3: Saving your page You use a text editor to create HTML documents and a Web browser to view them, but before you can let your browser loose on your HTML page, you must save that page. When you’re just building a page, you should save a copy of it to your local hard drive and view it locally with your browser. *Choosing a location and name for your file* When you save your file to your hard drive, keep the following in mind: 1. You need to be able to find it again. 2. Create a folder on your hard drive especially for your Web pages. Call it Web Pages or HTML (or any other name that makes sense to you), and be sure to put it somewhere easy to find. 3. The name of the file you want to save should make sense to you so you can identify file contents without actually opening the file. 4. The name should work well in a Web browser. Don’t use spaces in the name. Some operating systems — most notably UNIX and Linux (the most popular Web-hosting operating systems around) — don’t tolerate spaces in filenames; use an underscore (_) or hyphen (-) instead. For example instead of using "first page.html" as a page name, you can use "first-page.html" or "first_page.html" or even "firstPage.html". The last example is called camelCase as used in the page shown in the image below. It’s also a good idea to avoid other punctuation characters in filenames, and in general, to keep them as short as you can. * .htm or .html * You can actually choose from one of two suffixes for your pages: .html or .htm. The shorter .htm is a relic from the “8.3” DOS days when filenames could only include eight characters plus a three-character suffix that described the file’s type. Today, operating systems can support long filenames and suffixes that are longer than three letters, so we suggest you stick with .html. *Type of file* Depending on the text-editor you are employing for this task, you will get a variety of options in the select box for type of file. For Notepad, you will get 'Text file' and 'All files' options, choose the 'All files' option. For most other tedt-editors you will have more than 2 options, there will be options for different languages e.g. 'Html file', 'Css file', Javascript file', 'Php file', 'Json file' or options alike, to mention only a few. So logically, since we are working with html, your file type option is 'Html file'. Web servers and Web browsers handle both .htm and .html equally well. Stick with one filename option. .html and .htm files are treated the same by browsers and servers, but they’re actually different suffixes, so they create different filenames. (The name my_letter.html is different from my_ letter.htm.) This difference matters a lot when you create hyperlinks. Step 4: Viewing your page After you save a copy of your page, you’re ready to view it in a Web browser. Follow these steps to view your Web page in Internet Explorer or any other browser you would prefer. (Steps may be different if you’re not using Internet Explorer.) 1. If you haven’t opened your browser, do that now. 2. Choose File ➪Open. 3. In the Open dialog box that appears, click the Browse button. 4. In the new dialog that appears, navigate your file system until you find your HTML file, and then select it so it appears in the File name area. 5. Click the Open button, you are brought back to the Open dialog box. (Note: Newer versions of IE will warn you they must open a new browser window for your local file, for security reasons, if you’re already connected to the Internet; this is perfectly OK.) 6. Click OK. The page appears in your Web browser in all its glory. You aren’t actually viewing this file on the Web just yet; you’re just viewing a copy of it saved on your local hard drive. So don’t give anyone the URL (web address) for this file yet — but do feel free to edit the HTML source file and view any changes you make. An even faster way to view a Web page locally in a browser is to drag and drop the HTML file into an open browser window. You can do this from Windows Explorer or any other program that gives you file-level access. *Posting Your Page Online* After you’re happy with your Web page, it’s time to put it online. This is referred to as hosting your website. It is simply renting a space on the Net to accommodate your web pages for a specified period of time. Just like renting a room, yes. What you pay for it is a subscription for the agreed time like you subscribe for data. This are the steps you take: 1. Find a Web hosting provider to hold your Web pages.Your Web host might be a company Web server or space that you pay an Internet service provider (ISP) for. If you don’t have a host yet, double-check with the ISP you use for Internet access — find out whether you get some Web-server space along with your access. Regardless of where you find space, get details from the provider on where to move your site’s files and what your URL will be. 2. Use an FTP client or a Web browser to make a connection to your Web server. Use the username and password, as specified in the information from your hosting provider, to open an FTP session on the Web server. 3. Copy the HTML file from your hard drive to the Web server. 4. Use your Web browser to view the file via the Internet. Use Internet Explorer to access the site and provided the appropriate name and password, which you get from your ISP. A collection of folders and files will appear. Copy the file to the server with a simple drag-and-drop operation from Windows Explorer to Internet Explorer. The URL for this page is given, and the page is now served from the Web browser instead of from a local file system. If you do not understand much of what has been explained about the process of building your first web page from scratch, do not be discouraged in any way. This is only a quick overview of the process. You will learn the rudiments as we go on and find it easier and more interesting. If you did try to do something, which I strongly encourage, please post a snapshot of your web page in your text editor and again when opened on your browser. I will be glad to see anything you can do. Thank you for following through to this point, more to come. Programming gets more interesting from here. Powered by Programmers Community...
|
*Creating a Page from Scratch Part 2* Step 3: Saving your page You use a text editor to create HTML documents and a Web browser to view them, but before you can let your browser loose on your HTML page, you must save that page. When you’re just building a page, you should save a copy of it to your local hard drive and view it locally with your browser. *Choosing a location and name for your file* When you save your file to your hard drive, keep the following in mind: 1. You need to be able to find it again. 2. Create a folder on your hard drive especially for your Web pages. Call it Web Pages or HTML (or any other name that makes sense to you), and be sure to put it somewhere easy to find. 3. The name of the file you want to save should make sense to you so you can identify file contents without actually opening the file. 4. The name should work well in a Web browser. Don’t use spaces in the name. Some operating systems — most notably UNIX and Linux (the most popular Web-hosting operating systems around) — don’t tolerate spaces in filenames; use an underscore (_) or hyphen (-) instead. For example instead of using "first page.html" as a page name, you can use "first-page.html" or "first_page.html" or even "firstPage.html". The last example is called camelCase as used in the page shown in the image below. It’s also a good idea to avoid other punctuation characters in filenames, and in general, to keep them as short as you can. * .htm or .html * You can actually choose from one of two suffixes for your pages: .html or .htm. The shorter .htm is a relic from the “8.3” DOS days when filenames could only include eight characters plus a three-character suffix that described the file’s type. Today, operating systems can support long filenames and suffixes that are longer than three letters, so we suggest you stick with .html. *Type of file* Depending on the text-editor you are employing for this task, you will get a variety of options in the select box for type of file. For Notepad, you will get 'Text file' and 'All files' options, choose the 'All files' option. For most other tedt-editors you will have more than 2 options, there will be options for different languages e.g. 'Html file', 'Css file', Javascript file', 'Php file', 'Json file' or options alike, to mention only a few. So logically, since we are working with html, your file type option is 'Html file'. Web servers and Web browsers handle both .htm and .html equally well. Stick with one filename option. .html and .htm files are treated the same by browsers and servers, but they’re actually different suffixes, so they create different filenames. (The name my_letter.html is different from my_ letter.htm.) This difference matters a lot when you create hyperlinks. Step 4: Viewing your page After you save a copy of your page, you’re ready to view it in a Web browser. Follow these steps to view your Web page in Internet Explorer or any other browser you would prefer. (Steps may be different if you’re not using Internet Explorer.) 1. If you haven’t opened your browser, do that now. 2. Choose File ➪Open. 3. In the Open dialog box that appears, click the Browse button. 4. In the new dialog that appears, navigate your file system until you find your HTML file, and then select it so it appears in the File name area. 5. Click the Open button, you are brought back to the Open dialog box. (Note: Newer versions of IE will warn you they must open a new browser window for your local file, for security reasons, if you’re already connected to the Internet; this is perfectly OK.) 6. Click OK. The page appears in your Web browser in all its glory. You aren’t actually viewing this file on the Web just yet; you’re just viewing a copy of it saved on your local hard drive. So don’t give anyone the URL (web address) for this file yet — but do feel free to edit the HTML source file and view any changes you make. An even faster way to view a Web page locally in a browser is to drag and drop the HTML file into an open browser window. You can do this from Windows Explorer or any other program that gives you file-level access. *Posting Your Page Online* After you’re happy with your Web page, it’s time to put it online. This is referred to as hosting your website. It is simply renting a space on the Net to accommodate your web pages for a specified period of time. Just like renting a room, yes. What you pay for it is a subscription for the agreed time like you subscribe for data. This are the steps you take: 1. Find a Web hosting provider to hold your Web pages.Your Web host might be a company Web server or space that you pay an Internet service provider (ISP) for. If you don’t have a host yet, double-check with the ISP you use for Internet access — find out whether you get some Web-server space along with your access. Regardless of where you find space, get details from the provider on where to move your site’s files and what your URL will be. 2. Use an FTP client or a Web browser to make a connection to your Web server. Use the username and password, as specified in the information from your hosting provider, to open an FTP session on the Web server. 3. Copy the HTML file from your hard drive to the Web server. 4. Use your Web browser to view the file via the Internet. Use Internet Explorer to access the site and provided the appropriate name and password, which you get from your ISP. A collection of folders and files will appear. Copy the file to the server with a simple drag-and-drop operation from Windows Explorer to Internet Explorer. The URL for this page is given, and the page is now served from the Web browser instead of from a local file system. If you do not understand much of what has been explained about the process of building your first web page from scratch, do not be discouraged in any way. This is only a quick overview of the process. You will learn the rudiments as we go on and find it easier and more interesting. If you did try to do something, which I strongly encourage, please post a snapshot of your web page in your text editor and again when opened on your browser. I will be glad to see anything you can do. Thank you for following through to this point, more to come. Programming gets more interesting from here. Powered by Programmers Community...
|
*Creating a Page from Scratch Part 1* Using HTML to create a Web page from scratch involves four straight forward steps: 1. Plan your page design. 2. Combine HTML and text in a text editor to make that design a reality. 3. Save your page. 4. View your page in a Web browser. So break out your text editor and Web browser — and roll up your sleeves... Step 1: Planning a simple design We’ve discovered that a few minutes spent planning your general approach to a page at the outset of work makes the page-creation process faster and easier. You don’t have to create a complicated diagram or elaborate graphical display in this step. Just jot down some ideas for what you want on the page and how you want it arranged. You don’t even have to be at your desk to plan a simple design. Take a notepad and pencil outside and design in the sun, or scribble on a napkin while you’re having lunch. Remember, this is supposed to be fun. The example here is our take on the traditional “Hello World” exercise used in just about every existing programming language: The first thing you learn when tackling a new programming language is how to display the phrase Hello World on-screen. In our example, we create a short letter to the world instead, so the page is a bit more substantial and gives you more text to work with. Step 2: Writing some HTML You have a couple of different options when you’re ready to create your HTML. In the end, you’ll probably use some combination of these: 1. If you already have some text that you just want to describe with HTML, save that text as a plain-text file and add HTML markup around it. 2. Start creating markup and add the content as you go. To save a Word file as a text document, choose File➪Save As. In the dialog box that appears, choose Text only (*.txt) from the Save As Type drop-down list. The HTML markup includes a collection of markup elements and attributes that describe the letter’s contents: # The <html> element defines the document as an HTML document. # The <head> element creates a header section for the document. # The <title> element defines a document title that is displayed in the browser’s title bar. The <title> element is inside the <head>element. # The <body> element holds the text that appears in the browser window. The markup that follows the style=” “ attribute inside the <body> element is CSS, otherwise known as the Cascading Style Sheet markup language. It says we want white text on a teal background, where the text is larger than usual, and in a sans-serif font. # The <h1> element marks the Hello World text as a first-level heading. # The <p> elements identify each paragraph of the document. # The <br /> element adds a manual line break after a tag. Don’t worry about the ins and outs of how the HTML elements work. Also, please note that a Web page can include graphics, scripts, and other elements that we deliberately avoid in this contrived and simple example to keep things . . . well . . . simple! We will cover all these extras in detail later though. Whatever way you do this, you have to use a text-editor like: # Notepad # Notepad++ # Sublime text # Atom # Bracket # Visual Studio Code I would advise you as a beginner to do the work, start writing raw codes with Notepad, and you will learn faster and get a hold of the necessities quicker. After you create a complete HTML page (or the first chunk of it that you want to review), you must save it before you can see your work in a browser. Your page should look somewhat like the page in the image below which is saved with the name "First page.html" as noticed in the top of the image. Powered by Programmers Community...
|
. As you pray in the Spirit, the Lord would indeed put everything that concerns you into shape, even those things that you’re unaware of. You only need to trust Him with your life, realising that He’s big enough and willing to take care of you. Blessed be His Name forever!