nazwa_lekcji Sekcja 8: HTML|Formatowanie tekstu.

Powrót do strony głównej.

Powrót do moje lekcje programowania.

Sekcja 8: HTML|Formatowanie tekstu.

Spis treści:

40. Nagłówki - <h1> ... <h6> + ćwiczenia - 12.11.2022

Spis treści.
Kurs Programowania - Lekcja 40
lekcja 40 na Udemy

Największy nagłówek

Mniejszy nagłówek

Jeszcze mniejszy nagłówek





Podstawy Tworzenia stron - krótko i zwięźle

Czym jest HTML?

HTML to z ang. Hypertext MarkUp Language. Jest to języków tagów (znaczników).

Czym są tagi?

Tag to znacznik, służy do zaznaczania tekstu. Nadaje tekstowi określone z góry znaczenie.

Czym są atrybuty?

Atrybut to dodatkowa informacja o tagu. Niektóre tagi mogą mieć potrzebę umiejscowienia dodatkowej cechy dla tagu. Dzięki atrybutom jesteśmy w stanie taką cechę dodać.

Czym jest CSS?

CSS to język umożliwiający zmianę z jednego miejsca wyglądu wszystkich tagów na stronie. Korzystamy z niego, aby...

Czym jest selektor?

Selektor to operator, pozwalający wyselekcjonować(wybrać) ze strony konkretne tagi, które nas interesują, aby je później ostylować (nadać wyglądu).

Jak dołączyć plik CSS na stronie?

Aby dołączyć plik na stronie należy w sekcji head skorzystać z tagu.

h${tekst $}*6

tekst 1

tekst 2

tekst 3

tekst 4

tekst 5
tekst 6
                            
<ul>
    <li>Czym są nagłówki?</li>
    <li>Po co korzystamy z nagłówków?</li>
    <li>Jak korzystać z nagłówków?</li>
    <li>Skrót ALT + Z</li>
</ul>

    <h1>Największy nagłówek</h1>
    <h2>Mniejszy nagłówek</h2>
    <h3>Jeszcze mniejszy nagłówek</h3> <br><br><br><br>



    <h1>Podstawy Tworzenia stron - krótko i zwięźle</h1>

    <h2>Czym jest HTML?</h2>

    <p>HTML to z ang. Hypertext MarkUp Language. Jest to języków tagów (znaczników).</p>

    <h3>Czym są tagi?</h3>

    <p>Tag to znacznik, służy do zaznaczania tekstu. Nadaje tekstowi określone z góry znaczenie.</p>

    <h3>Czym są atrybuty?</h3>

    <p>Atrybut to dodatkowa informacja o tagu. Niektóre tagi mogą mieć potrzebę umiejscowienia dodatkowej cechy dla tagu. Dzięki atrybutom jesteśmy w stanie taką cechę dodać.</p>

    <h2>Czym jest CSS?</h2>

    <p>CSS to język umożliwiający zmianę z jednego miejsca wyglądu wszystkich tagów na stronie. Korzystamy z niego, aby...</p>

    <h3>Czym jest selektor?</h3>

    <p>Selektor to operator, pozwalający wyselekcjonować(wybrać) ze strony konkretne tagi, które nas interesują, aby je później ostylować (nadać wyglądu).</p>

    <h3>Jak dołączyć plik CSS na stronie?</h3>

    <p>Aby dołączyć plik na stronie należy w sekcji head skorzystać z tagu.</p>

    h${tekst $}*6
    <h1>tekst 1</h1>
    <h2>tekst 2</h2>
    <h3>tekst 3</h3>
    <h4>tekst 4</h4>
    <h5>tekst 5</h5>
    <h6>tekst 6</h6>

                            
                        

41. <cite> vs <blockquote> vs <q> - jak poprawnie cytować innych? - 12.11.2022

Spis treści.
Kurs Programowania - Lekcja 41
lekcja 41 na Udemy
„coś tam”

Albert Einstein

„Wiadomo, że taki a taki pomysł jest nie do zrealizowania. Ale żyje sobie jakiś nieuk, który o tym nie wie. I on właśnie dokonuje tego wynalazku.”

Adam powiedział: Przekaż jej, że jej nie lubię

Lepiej zaliczać się do niektórych, niż do wszystkich. Andrzej Sapkowski, Krew elfów

                            
<ul>
    <li>Różnice pomiędzy q, blockquote, cite.</li>
</ul>


„coś tam”<br><br>

<p>
    <cite>Albert Einstein</cite>      
    <blockquote>„Wiadomo, że taki a taki pomysł jest nie do zrealizowania. Ale żyje sobie jakiś nieuk, który o tym nie wie. I on właśnie dokonuje tego wynalazku.”</blockquote>
</p>

<p>Adam powiedział: <q>Przekaż jej, że jej nie lubię</q></p>


<p>
    <q>Lepiej zaliczać się do niektórych, niż do wszystkich.</q>
    <cite>Andrzej Sapkowski, Krew elfów</cite>
</p>

                            
                        

42. <abbr> & <dfn></dfn> - 12.11.2022

Spis treści.
lekcja 42 na Udemy
Nazwa zdjęcia gdy te się nie wyświetli

HTML to język znaczników do tworzenia stron WWW.

                            
<ul>
    <li>abbr - abbreviation - skrót</li>
    <li>dfn - define - definiować</li>
</ul>

<p>
    <dfn><abbr title="HypertText Markup Language">HTML</abbr></dfn> to język znaczników do tworzenia stron WWW.
</p>

                            
                        

43. Tagi semantyczne <strong>, <em> i <mark> vs <b>, <i>, <u>, <s></s> - 12.11.2022

Spis treści.
lekcja 43 na Udemy
Nazwa zdjęcia gdy te się nie wyświetli
TAGI SEMANTYCZNE (poza formatowaniem mają dodatkowe znaczenie) podkreślenie pod tekstem przekreślony tekst

Uwielbiam koty i psy.

Uwielbiam koty i psy.

Zanim to zrobisz to upewnij się, że przeczytasz instrukcję obsługi.

CSS jest odpowiedzialny za wygląd Twojej strony internetowej.

CSS to z ang. Cascading Style Sheets czyli Kaskadowe Arkusze Stylów.

                            
                                                        
<ul>
    <li><b> - bold        pogrubienie           font-weight: bold;</li>
    <li><i> - italic      kursywa               font-style: italic;</li>
    <li><u> - underline   podkreślenie          text-decoration: underline;</li>
    <li><s> - strike      przekreślenie         text-decoration: line-through;</li>
</ul>

TAGI SEMANTYCZNE (poza formatowaniem mają dodatkowe znaczenie)

<ul>
    <li><strong>          'silny'                         (formatowanie DOMYŚLNE <b>)</li>
    <li><em> - emphasis   'podkreślenie/akcent/nacisk'    (formatowanie DOMYŚLNE <i>)</li>
    <li>
        <mark> - 'oznaczyć markerem' z pomocą domyślnie żółtego koloru.
    </li>
</ul>


<u>podkreślenie pod tekstem</u>
<s>przekreślony tekst</s>


<p>
<em>Uwielbiam</em> koty i psy.
</p>

<p>
Uwielbiam koty <em>i</em> psy.
</p>

<p>
Zanim to zrobisz to upewnij się, że <strong>przeczytasz instrukcję obsługi</strong>.
</p>


<p>
CSS jest odpowiedzialny za <strong>wygląd</strong> Twojej strony internetowej.
</p>

<p>
<dfn><abbr title="Cascading Style Sheets"><strong>CSS</strong></abbr></dfn> to z ang. <b>C</b>ascading <b>S</b>tyle <b>S</b>heets czyli Kaskadowe Arkusze Stylów.
</p>

                            
                        

44. <sub> vs <sup></sup> - 12.11.2022

Spis treści.
lekcja 44 na Udemy
Nazwa zdjęcia gdy te się nie wyświetli
H2O
x2 = 0
                            
<ul>
    <li><sub> - subscript - indeks </li>
    <li><sup> - superscript - napisany u góry</li>
</ul>


H<sub>2</sub>O<br>
x<sup>2</sup> = 0

                            
                        

45. Tekst preformatowany, tagi: <pre>, <code>, <var></var> - 12.11.2022

Spis treści.
lekcja 45 na Udemy
                        
                            #include 
                            #include 
                            #include 
                            
                            using namespace std;
                            
                            int main()
                            {
                            
                                vector wholeNumbers {20, 10, 4, -3, 25};
                            
                                double nrOfPeople = 20.5;
                            
                                cout << nrOfPeople << endl;
                                cout << typeid(nrOfPeople).name() << endl;
                            
                            
                                for(auto it = wholeNumbers.begin(); it != wholeNumbers.end(); it++)
                                {
                                    cout << *it << endl;
                                }
                            
                            
                                return 0;
                            }
                        
                    

Liczba 70 jest o 40% większa od liczby c. Jaką wartość ma liczba c?

                        
<ul>
    <li>pre - pre formatted (sformatowany tekst przed wklejeniem)</li>
    <li>code - tag używany do oznaczenia kodu (by odróżnić go od tekstu)</li>
    <li>var - variable (zmienna) - do pokazania, że w tekście jest zmienna</li>
</ul>

<pre>
    <code>
        #include <iostream>
        #include <vector>
        #include <typeinfo>
        
        using namespace std;
        
        int main()
        {
        
            vector<int> wholeNumbers {20, 10, 4, -3, 25};
        
            double nrOfPeople = 20.5;
        
            cout << nrOfPeople << endl;
            cout << typeid(nrOfPeople).name() << endl;
        
        
            for(auto it = wholeNumbers.begin(); it != wholeNumbers.end(); it++)
            {
                cout << *it << endl;
            }
        
        
            return 0;
        }
    </code>
</pre>
    
<p>Liczba 70 jest o 40% większa od liczby <var>c</var>. Jaką wartość ma liczba <var>c</var>?</p>

                        
                    

46. Multikursor | Przeszukiwanie i podmiana tekstu w VSC - 12.11.2022

Spis treści.
lekcja 46 na Udemy