How to open page code using keys. How to change page code in Google Chrome

For a long time, the “show page source” option was useless and uninteresting for me. So far, learning HTML on Codecademy and designing my own websites has not grown into my new hobby. This is where the question arose: where to find real cases and borrow interesting solutions for your “piggy bank”? The answer was unexpectedly simple, like all ingenious things: look at the source code of the page in Google Chrome! I share with you my modest finds.

What is the page source code

If you, like me, are just taking your first steps in HTML programming, it would be a good idea to find out what the source code of a page is.

Source code, also known as HTML page code, is text in Hyper Text Markup Language (HTML). It includes the actual page content (text, tables) and tags. The latter act as instructions for the browser: how to display content, what type of formatting to use, where to insert a hyperlink or media file. Well, for us, novice programmers, the source code is the best training ground: we find an interesting site and spy on it, save it, and use successful fragments. How?

How to view the source code in the Google Chrome browser page

Find the page you like. For example, I was interested in the design of the site menu. There are three ways to open the source code in the Google Chrome browser:

1. Click on the icon menu in the upper right corner of the browser and select “More tools”. Among others, there is an option “View source code”. Frankly, I rarely use this method: there are a lot of unnecessary movements. It can be made even simpler.
2. Press the key combination Ctrl+U– a new window with the source code opens;
3. For fans of the context menu: right-click on the page and select the “View page code” option.

We coped with the task of viewing the HTML code of the page in the browser. Let's move on to the most interesting stage.

How to edit and save source code

To learn how to create websites, it is not enough to read someone else's HTML code. You need to play with it, experiment, make changes and check the result. You can even start by compiling a few successful samples. How to edit and save source code?

Option 1. “Manually”

After we have opened the source code of the page, call the context menu and select the “Save As” option and save the file to your hard drive. We edit the file in Notepad or Notepad, save the changes and open it through the browser. The results of our changes (successful and not so successful) will be reflected in the browser window.

Option 2. For the pros

When you "play" with source code every day, the process of "save - open - change - save - check" becomes tiring. For myself, I found a solution in the form of installing a plugin for Google Chrome - Firebug Lite. It allows you to edit and save source code without leaving the browser window.

Instructions

The easiest way to open html is code associated with the use of built-in browser capabilities. Each of them has a viewing option code pages. So, in the Internet Explorer browser to view code you need to open it in the menu: “View” - “View html- code».

For those who work with the Opera browser, to view code you should open: “View” - “Source Code” or press the key combination Ctrl + F3. Mozilla Firefox users can view the html code by right-clicking on the page and selecting “Page Source Code” from the context menu.

Users working with Google Chrome should also use the context menu, called up by right-clicking on the page being viewed, and select “View” code pages".

To save open source code in Opera, on the open html page, click the “Save” button in the upper left part of the window. In Mozilla Firefox, select “File” - “Save page as...”. HTML code is saved in the same way in IE. In Google Chrome, right-click the open source code and select “Save As” from the context menu.

If you need to work with saved code, use special programs for this. To master the HTML language, the editor with syntax highlighting CuteHTML is perfect, it is very simple and easy to use. With its help you can create quite complex pages.

To work professionally with HTML and create complex websites, use Dreamweaver. This is a visual website builder that allows you to quickly create even very complex projects. Working in this program, you can use ready-made website templates, which will significantly speed up and simplify the creation of an Internet resource.

Many free templates, based on which you can create very beautiful websites, are available online. Just download the template you like, open it in Dreamweaver and modify it the way you want. You can download ready-made templates here: http://www.internet-technologies.ru/templates/.

An Internet web page may contain a link to a Word document. When you click on a link, it can be displayed either in the browser or in a text editor. What is the best way to open a text file?

The Word editor does not have independent settings regarding whether the document is sent from the browser. All settings are configured directly in Windows.

Open the File Types dialog box by doing one of the following:

Press and hold the Windows key (it contains the OS logo and is located at the bottom of the keyboard, between the Ctrl and Alt keys).
- On your desktop, double-click the My Computer icon.

Now from the menu that appears, select Tools > Folder Options and go to the File Types tab. You will have to wait a few minutes while Windows collects information about various file types.

When the list appears, you should find the DOC extension in the list. Click on it to highlight it and then click on the "Advanced" button. You can now see the Edit File Type Properties dialog box. Editing offers 2 options for displaying Word documents in the browser.

Opening a document in a text editor

This is the default setting. If you decide to keep it, you only need to configure some settings. If you want to be able to choose whether to open or save a document, you must check the box next to “Confirm opening after downloading.” Please note that if you uncheck the “Always ask when opening this file type” checkbox, you will not be able to check the above box.

Opening a document in Internet Explorer

In the Change File Type Properties dialog box, check the box next to the Browse in the same window tab. This setting means that the Word document will open in Internet Explorer by default. The browser will use the corresponding plugin, the toolbar of which is a combination of the main menu of Word and Internet Explorer. You can edit and format your document just as you would in a word processor, but some options may not be available.

Removing this setting is not difficult. Simply open the "Change File Type Properties" dialog box and uncheck "Browse in the same window." After this, the document will be loaded into Word by default.

Opening a document in other browsers

It is possible to open a document in other browsers only after installing special plugins. For example, View Docs is developed for Opera, Google Docs Viewer is available for Firefox, and so on. There is also a large selection of online tools that do not require any downloads or installations on your computer.

Instructions

Using a browser, go to the site where you want to change the HTML code. To do this, enter the resource address in the address bar of your browser or use one of the Internet search engines.

Open code pages to view. Depending on the browser you are using, you must select the appropriate menu item. In Opera to view the original code and use “View” - “Development Tools” - “Source” code" In Google Chrome, this feature is available in the "Tools" - "View Source" section. code" If you are using Mozilla Firefox, click on the “Menu” key - “Web development” - “Source” code pages". Depending on your browser settings, HTML code will open in a new tab or window.

Edit the displayed code. In Firefox and Chrome, to edit a document, you must first save it to your hard drive (File - Save Page As).

After making all changes, save the page using the “Save” button. The document has been loaded. You can change it yourself using any text editor.

To save a complete copy of the page with all images, go to the resource you need and select the “File” - “Save As” menu. In the window that appears, select the document type “HTML file with images.”

Helpful advice

For visual editing of HTML, there are many editors that provide syntax highlighting and automatically substitute missing descriptors. One of the most powerful web developer tools is Macromedia Dreamweaver. As an alternative, there is a lighter Front Page. If you don't need visual debugging and just need underlining and coloring of syntax, you can use the more lightweight but powerful editor Notepad++.

Sources:

• how to change source code

From the answer to the question “What should I call the article?” depends not only on the number of people who read it, but also, without exaggeration, on the reputation of the entire site on which it is posted. After all, each article is a small stroke in the overall picture of the resource, and the combination of many individual strokes creates a unique image of the whole site.

Instructions

It’s better to leave the title for later, when the text itself is ready. When writing, this will allow you not to limit the flight of thought within the framework established by the title. Having the finished text in front of your eyes, it is easier to determine the title that best reflects all the nuances of the article. Re-read the finished text, mentally formulate the essence of the text in several succinct phrases.

Depending on the audience of the site, we select an article template. Obviously, flashy headlines are not suitable for articles, for example, on legal topics. Conversely, a serious headline for a light material will scare off a percentage of potential readers. There are many templates for article titles, for example:

Intriguing question (“Do you know that...?”)

A question starting with the word “how?” (“What should I call the article?”)

Address to the audience (“Only students…”)

Sentence-statement (“Pond at the dacha – peace of mind”)

Offer-guarantee (“Guaranteed method...”)

Incentive to action (“Get a discount...”)

Of course, article headings are not limited to this list of templates.

We create several variants of names using the selected templates. Then we cut off the unsuccessful ones and leave those that:

Most accurately reflect the essence of the article

Relevant to audience interests

Sources:

• Denis Kaplunov. Free master class on writing headlines
• article title

HTML (HyperText Markup Language) instructions are sent by the web server at the request of the browser of a site page visitor and contain complete information about what and how the browser should show the visitor of this page. Today, these instructions are most often generated by server-side scripts, rather than stored ready-made in files. If the need nevertheless arises to edit the HTML code, and not the scripts that form it, then this can be done using different tools.

Instructions

Use the content management system editor to edit the source HTML code. To do this, after loading the desired one into the editor, you need to switch it from visual mode (which is sometimes called WYSIWYG mode) to HTML editing mode. By doing this, you will get directly to the instructions ("tags") of the markup language. However, using the visual mode, you also change the HTML tags, doing this in the “” page editor.

Use any text editor to make changes to the HTML code of pages if yours does not have a control system installed. The files storing this code differ from ordinary text files only in the extension, and the recording format exactly corresponds to the format of files with the txt extension. Therefore, any text editor that can work with txt files can also be used to edit HTML code.

Install a specialized HTML code editor if you plan to do page layout quite regularly. Such programs differ significantly from ordinary text editors and from editors installed in controls. For example, they have “contextual hint” functions, that is, when you start typing an HTML tag, the editor offers you the most suitable options, which significantly speeds up typing, reduces the number of typos and helps you quickly master the syntax of the language. In addition, such programs can format and color the entered code, look for errors in syntax, and check compliance with established standards. Many specialized applications of this kind have a visual editing and page preview mode, can upload created pages to , synchronize local and remote versions of HTML pages, and much more.

Sources:

• how to edit a website page

It’s not enough to write a good article for the site, you also need to come up with the right one title. It should simultaneously reflect the meaning of the article and ensure that the user can quickly find it in a search engine. To find out which headline will be successful, look at the search engine statistics.

You will need

• - computer
• - Internet access

Instructions

Make the title successful in terms of search engine optimization, let it include keywords. Find out what words and phrases users are looking for in search engines. To do this, view the request statistics. For example, in Yandex this can be done on the wordstat.yandex.ru page. For example, you look at the statistics for the word “money” and see that there were 3,613,993 impressions per month. This means that so many times it appeared in Yandex search results, including various phrases. If you're interested in how many times people searched for the word "money" by itself, type it in quotes and with an exclamation point at the beginning: "!money."

If you have little experience in SEO and website content, promote articles using low-frequency queries. High-frequency ones include, for example, this one: “How to make money.” This phrase was searched many times during the month, and it will be difficult for you to fight the competition, because... you are unlikely to appear in the first pages of the search, not to mention the TOP. At the same time, the phrase “How to make money for an apartment” was typed only 146 times in a month, so if you write about this topic, you will have a good chance of getting a worthy place in the search.

Don't create headlines for queries that are too low in volume. Even if you are in the top for a phrase that you searched for twice a month, you still won’t get many visitors. But if you think that the topic is promising (for example, it concerns some new gadget), then you can try it. It's also good to use titles that include the keyword or phrase (beginning with it) but are unique.

Make the title of the site interesting. It’s good if it involves solving a problem and is short and concise. Learn to put maximum meaning into a minimum of words. Let the user know that your article contains useful information.

Try to add intrigue to the title, for example by questioning conventional wisdom, playing on contrasts, etc. The words “how”, “why”, “why” also attract attention.

Video on the topic

Helpful advice

Make your headlines more specific; if you are writing about a specific phenomenon or brand, mention it. This increases the likelihood that your target audience will reach your web page.

Instructions

When mentioning a site in text located on another resource, use the following construction in HTML: Cat Photography Tutorial. In this case, the site name will be highlighted in color, and in some browsers it will also be underlined. When you move the mouse arrow to it, the address will be displayed in the lower left corner of the browser, and if you click on the link, it will be followed - depending on the browser settings, in the same or another tab.

You can also make sure that, in addition to the name of the site, its URL is also displayed in the text, even when the mouse arrow is not brought to it. To do this, use another construction:

Cat Photography Tutorial: http://site.domain

If you do not want to click on a link to follow it, do without using HTML tags at all, for example, like this:

Cat Photography Tutorial: http://site.domain

HTML code is a program code that determines how elements (text, pictures, videos, etc.) will be arranged on an Internet page. The HTML language is quite easy to understand, but it is constantly being improved and supplemented with new features.

What is HTML code?

The abbreviation HTML is translated as “hypertext markup language”. Hypertext is a special method of navigating Internet pages, implemented in the form of hypertext links. By clicking on these links you can easily navigate the site structure. Transitions in this case do not occur linearly, i.e. you always have the opportunity to go to any page of the site, the link to which is currently visible.

Markup refers to certain rules and properties that are assigned to page elements. They are implemented in the form of so-called tags. For example, to indicate that certain text on a page should be centered, you can mark it with the center tag. You can see the HTML code of a specific page through its context menu. For example, to access this code in the Firefox browser, you need to right-click within the page and select “Page Source Code”.

How does HTML code work?

HTML code is a set of short tags containing page elements. All this code is stored in a file with the extension .html or .htm. When you open such a file in a browser, the code is interpreted by it, and the finished page is displayed in the program window. Knowing the HTML markup language, almost anyone can create their own page.

What are the types of tags?

Tags are separate constructs within HTML code. This is plain text enclosed inside angle brackets "". You can see tags in the HTML code of almost any page. The tags themselves are not displayed on the pages; they display a specific element that is encoded using tags. For example, if there is a picture on the page, then its HTML code contains the img tag.

HTML Limitations

Despite the fact that HTML code allows you to build a fairly high-quality hypertext page, it has its limitations. Pages containing exclusively such code are static, i.e. they lack dynamics, special effects and other features. But they can be introduced using other languages, such as Java Script. The vast majority of modern websites are created using additional languages ​​that make them more lively and interactive.

What attracts the reader’s (user’s) attention on the page of a printed or online publication?

• Picture


• Heading


• Subtitle


• Signature under the picture or photo

As sad as it is, people don’t want to read, they don’t have time, because they are endlessly in a hurry to get somewhere. But if you are an author (journalist, blogger, freelancer, news writer, writer), you want to convey to the reader your thoughts, conclusions, vision of the problem, etc. How to make sure that the reader does not skip past your note? How to make the title enticing, so that you want to delve deeper into the article?

1. Use verb forms in your titles.

For example: “Where to invest money”, “How to make a home first aid kit”, “Putin’s new decree”.

2. The principle of novelty.

Headlines like “Spring is a time for worries” are morally outdated. Let “bureaucratic” newspapers and magazines use them. The title should convey something new, something that is unknown and that will be revealed in more detail in the text of the note. For example, a better headline would be: “Spring worries will not allow farmers to rest.”

3. Metaphor, imagery, oxymoron, unusualness in the title will give the article a chance to be read. Use sharp comparisons, epithets, and semantic emphases of certain letters. The main thing is not to overdo it with means of expression. Everything should be in moderation.

4. Practicality is important to the reader (user). Titles that are vague, not meaningful, or too general will leave the article without attention. Why should I read the text? What will this give me in practical terms? What will I take away from it? Will this experience be useful to me? If the reader finds answers to these questions at the level of the title, and not the text, then the article will be read.

Instructions

In Mozilla FireFox, expand the “View” section in the menu and click “Original” code" The same item is also in the context menu, which, if you right-click the text pages. You can also use the keyboard shortcut CTRL + U. Mozilla FireFox does not use external programs - original code pages with syntax highlighting will be opened in a separate browser window.

In Internet Explorer, click the File menu and select Edit in Notepad. Instead of the name Notepad, another name may be written, you have assigned it in the browser settings to view the original code A. On click pages with the right mouse button, a context menu appears, which also has an item that allows you to open the source code pages in an external program - “View HTML- code A".

In the Opera browser, open the menu, go to the “Page” section and you will have the opportunity to select “Source” in the “Development Tools” subsection code"or the item "Original code frame." These selections are assigned the hotkeys CTRL + U and CTRL + SHIFT + U, respectively. In a context menu bound to a click pages right-click, there is also an item “Initial code" Opera source pages in an external program that is assigned in the OS or in the browser settings for editing HTML files.

Google Chrome browser without any doubt has the best organization for viewing the original code A. By right-clicking your mouse, you can select View code A pages"and then the source code with syntax highlighting will be opened in a separate tab. Or you can select the line “View” in the same menu code element” and in the same tab will open two additional frames in which you can inspect HTML and CSS code element pages. The browser will respond to the cursor moving across lines code and, highlighting elements on the page that correspond to this section of HTML code A.

In the Apple Safari browser, expand the View section and select View HTML code A". In the menu that appears when you right-click open pages, the corresponding item is called “View source”. The hotkeys assigned to this action are CTRL + ALT + U. Original code in a separate browser window.

Sources:

• how to change assigned keys in firefox

Quite a lot of people, having encountered difficulties in computer games that they cannot overcome, use special codes to solve this or that problem or simplify the game. A cheat code is a code that can be entered into a computer game in order to change the course of its operation. Entering such codes is carried out by reproducing a certain text (consisting of letters or numbers) on the keyboard. You can also enter text in specially designated areas (game menu or console). How can I find the code for the game?

You will need

• Internet

Instructions

Let's consider the first method using the popular example http://chemax.ru. In order to find a code for a specific game, click on the “Cheat Codes” tab, and then select “For”. In the window that opens, you can either enter the name of the game into a special one (which will facilitate the search process), or click on the English or Russian letter with which the name of the game begins. After selecting a game, you will see a list of all possible codes.

In order to download the cheat code database, you need to go to the website http://chemax.ru and select the “CheMax” - “CheMax Rus” tab. This database of cheat codes is also Russian-language and has a huge number of games represented. When installing, you should select the Russian language and the location of the program on your . After you launch the program, you need to enter the name of the game in a special line, as a result of which you will receive all the necessary cheat codes.

Video on the topic

note

Do not forget to update this program promptly in order to have the most complete code base.

Helpful advice

Try to complete the game without using cheat codes, because completing the game honestly will give you much more pleasure.

Let's look at how to determine the initial code pages, because this parameter is very important when working on the Internet. If you need any news, tags or a picture, but you don’t know how to write it, you can always copy information from another site after finding out the original one code pages if he's not for code created by the site developers. The original is important code in paged files that are not programs, using the source code and you can work with pages and edit them.

You will need

• Instructions for viewing the source code of the page.

Instructions

To be visible, it is registered with the original code ohm Fill it with code You can, if you are the owner of the resource, or change it using notepad, an editor, using special extensions for this. The user can also change the page by editing the file and adding his own . In - browsers viewing the source code and is carried out using various commands, let’s look at them in more detail.

For Internet Explorer, select the "view" tab, then "original" code pages»or the item can be selected by clicking the right mouse button. To be encrypted by the developers code in this we go to the “service” menu, then “developer tools”, click the arrow, select the desired element on and code become . Next, click on the icon and code in text format and copy from its components into html.

The Mozilla Firefox browser provides the ability to view using a simple command “Ctrl+U” or in the “tools” menu select the substring “view source” code" You can view encrypted information in Mozilla Firefox by installing a special Web Developer, select from the menu “ code" string "generated code" and below pages the value of the original appears code A. Copy the file to the clipboard or save it with the extension page.htm.

When using Google Chrome, in the main “tools” menu, select the substring “view source code", then use the right mouse button to open the item "view code A pages» or using the keys "Ctrl + U".

For the Safari browser, in the menu we find “view html- code", also by right-clicking, open the substring "view source" or use the keyboard shortcut "Ctrl + Alt + U".

note

The ability to view encrypted information about the source code is carried out using two browsers.

Helpful advice

If you are not a site developer, you can change the page only for your own use.

In computer games, as in real life, there is an opportunity to cheat a little. For this purpose, developers provide their products with various codes, using which from the game menu you can easily complete levels and missions.

You will need

• CheMax software.

Instructions

To find out the codes that were once used by developers during testing, it is not at all necessary to open all exe files of the game product using HEX editors. You just need to go to a specialized site for cheats using the following link http://chemax.ru.

On the loaded page, move the cursor to the menu bar, namely the “Cheat Codes” section, and in the list that appears, select “In language”. On the next page, enter the name of the game in the search bar, then click the “Search” button. It is recommended to enter the most complete name, which can be copied from the shortcut properties. To do this, go to the desktop and right-click on the game shortcut. In the context menu, select “Properties” and copy the name using the keyboard shortcut Ctrl + C or Ctrl + Insert.

From the search results, select the most appropriate option to open the code table. In addition to the table of codes, if you scroll to the bottom of the page, you can also find a list of trainers with active links. To quickly access the necessary codes before you remember them, it is recommended to select and copy the information from the downloaded page, then paste it into a new text document.

Constantly accessing the site in order to obtain the necessary code is a very long task, because... launching a special program (CheMax) is many times faster. To do this, go to the CheMax top menu and select CheMax Rus. On the program download page, click on the “Installer” or “RAR Archive” link and specify the location to save the executable file.

After installing the program, a shortcut will be placed on the desktop, launching which will open the program. During the game, press "Pause" and use the Alt + Tab combination to navigate to an open window. In the search bar, enter the name of the game and press Enter.

Video on the topic

Sources:

• How to find out the banner code?

The program code may vary in terms of privacy - many developers do not make it publicly available and the terms of the license agreement impose restrictions on users regarding its use and viewing. There are also open source programs that can be viewed, edited, and so on.

You will need

• - a program for opening source code.

Instructions

Make sure that the source code of the software you want to view is open source. To do this, go to the official website of the software developer and view the license type. If the source code of the program is closed, you cannot view it. This is inconvenient, but with such a system it is quite rare to encounter copies of a program containing Trojans and other malicious programs. This is the main disadvantage of free software.

If you have free software, find “Source Code” in the program menu, if such an item is provided by the developer, which is extremely rare. To view it in other cases, use an assembler or other third-party software.

Often, to open the source, you need to know what programming language the creators of the program used during development, which is often very difficult to determine. Here you can install on your computer a set of different programs for opening source codes written in different languages.

When using free software, if you have the option, review the source code before the installation process, especially if the program was downloaded from an unofficial source. This will help protect your computer from malware that is installed along with the main one.

Also, do not resort to various methods of making changes to the closed source code of a program; often in such cases there is a certain liability for violating the rules of the license agreement between the user and the developer. Moreover, do not post edited such programs on the Internet.

Video on the topic

Helpful advice

Check the sources of free software.

Programs divided into open and closed. In the first case, all Internet users can download its original code from the official website and other resources, in the second - the system code is closed and its

1 vote

Good day, dear readers of my blog. Sometimes you find some beautiful feature on a website and begin to wonder how the creator achieved such an interesting effect.

It turns out that the answer is quite simple. And if you have some skills, you can collect a lot of these features and create your own unique website in a short time.

Today we will talk about how to open the code of a page, a certain element, and learn how to use this skill for your benefit.

Basic knowledge of code

My site is intended for beginners and first I would like to briefly talk about sites and code in general.

To draw a picture, then cut it into small parts, write code so that the browser will reassemble all the elements into a single whole. Does everything seem very complicated? Not at all, and there’s no point in grieving about it.

This is how high-quality websites are created. If you want, get involved in this matter and study it; if you don’t want to, no one can force you.

I will only say one thing... there is nothing more pleasant than seeing how incomprehensible words you wrote are transformed into a single whole and come to life: links work, buttons move, pictures move, text crawls. I think I know how Victor Frankenstein felt.

When you begin to comprehend the secret language and see that everything is actually much simpler than it initially seemed, you cannot help but believe in your own strengths and capabilities of the brain. This is very cool.

How are websites made? Ideally, first. He's just painting a picture. For example, as shown in the picture below. For now it is just an image, a photograph. No links work, when you click you don’t go anywhere, no search is carried out.

According to this drawing. Look at the screenshot below. You may think that this is a ridiculous and very complex set of symbols. In fact, everything is not so complicated, there is a certain algorithm.

There are only about 150 tags and each of them is responsible for a specific action: link, hyphenation, bold, color, title, and so on. Understanding them is not so difficult if you have the desire and don’t mind the time.

Thanks to knowledge of these attributes, you can solve almost any problem. But each developer finds his own ways to achieve the goal.

Experienced creators immediately see how to achieve results, while others have to think, look for the answer in articles or in the source code of competitors. They simply take the necessary part from a third-party site and edit it for themselves. This significantly shortens the work process.

A little later, I will show you a specific example.

View code

So, let me first show you how to act if you need to find out someone else's html. Then we will look at all the other questions in more detail.

The best way

The method that I will describe first is a little complicated for beginners, but as an introduction, read it. Open the page and click on the right mouse button. Select “Save as...”

Save the entire web page. As you can see in the screenshot, I have already downloaded everything in advance. Here we have two folders.

Everything you need is here. Every element. If you understand this, you can quickly get everything you need. But such a task is increasingly becoming impossible. There is no downloading. What to do if it is prohibited to copy a page?

This is Google Chrome

As you may have already noticed, I most often use Google Chrome and learning someone else's code in this browser is as easy as shelling pears. As in principle with any other. The scheme will not only be similar, but identical. Open the page whose code we want to know and right-click anywhere. In the window that appears, click “View page code”.

A sheet of code will open in a new window, which is quite difficult for a beginner to understand. But don't be alarmed ahead of time.

If you need to know the code of only one element, just hover over it with the mouse and right-click. Select another Chrome function: “View element code”.

For example, I might be interested in how the logo was made, using a picture or a programming language? After all, you can draw a square using CSS. Many experts advise writing down as much information as possible in code. How do they work on popular sites?

Now the necessary information has appeared. html on top, css on bottom. These are two languages. The first is responsible for the text component, and the second for the design. If there were no CSS, then you would have to specify the color and font size each time. For each page, this is very long. But if there were no html, then we would not have texts. I explained it roughly, but in general, that’s how it is.

By the way, if you are interested in how it works here, you can look at the link to the picture below. Here's your answer.

Mozilla Firefox

If you like to work in mastic, then everything will be exactly the same. Open the page and click on the right mouse button. “Page source code” if you want to see the entire code.

When you hover over an element, you can open its code.

Here the data is displayed at the bottom of the screen, but otherwise everything is exactly the same.

Yandex browser

In the Yandex browser, everything is exactly the same as in the previous two options, open the page, right-click, see the page code.

We hover the cursor over an element if we want to find out exactly its code.

Everything is displayed here exactly the same as in Chrome.

Opera

And finally, Opera.

By the way, you may have noticed that you don't have to use a mouse. There is a quick keyboard shortcut to open the code, and it is the same for all browsers: CTRL+U.

For elements: Ctrl+Shift+C.

This is what the result looks like.

This will be interesting for beginners

Now look how everything works. You find a site and really like some element. For example, this one. You already know how to open the element code.

Now copy it.

I use , paste this code into a new html file, into the body tag (body in English).

Now let's see how it will all look in the browser.

Ready. In order for the text to be aligned to the edges and acquire a greenish color, you need to connect css to this document and copy another code from the site from which we copied this one.

I won't do this now. This requires more time: both mine and yours. I think that I will describe all the details in my future publications. Subscribe to the newsletter and be the first to know when an article appears.

If you can’t stand it, but want to learn more about html and css now, then I can traditionally recommend you free training courses.

Here are 33 lessons that will allow you to master html - "Free course on HTML" .

And here is complete information about css - “Free course on CSS (45 video lessons!)” .

Now you know a little more. I wish you success in your endeavors. See you again!