Software testing | HTML common knowledge points

what is web

web is the abbreviation of world wide web, which is called global wide area network, commonly known as WWW. For users, it is actually a service (Web) composed of multiple web pages.

We can understand the web as the current Internet. For us, it is more about website services. We can think of a website as a service composed of multiple web pages.

The web front end is responsible for the content of the front page of a website. A web page is a file written by front-end engineers using HTML language, which contains text, pictures, hyperlinks, audio, video, and so on.

Note: Hyper Text Markup Language (HTML) is a computer language used to describe web content.

What is HTML

HTML (Hyper Text Markup Language) is a computer language used to describe web pages.

HTML development

At the beginning of the Internet, there was no HTML, and we could only transmit the simplest text content through the network. With the increasing demands of users and the continuous development of our technology, HTML1.0, a language that can express content other than text, has been released. Later, it slowly developed to the current HTML5, which is what we often call H5 now.

HTML viewer

During testing, we sometimes need to use tools to view the corresponding HTML code. Here we can use the developer tool that comes with the browser, and the shortcut key to open this tool is F12.

Developer Tools is a pretty powerful tool. You can view and modify HTML, debug js, modify css, view network data, and perform performance testing. Very versatile. For our web testing, it is a tool that must be mastered.

To view the HTML source code, we only need to enter the elements interface of the developer tools. Here you can locate the elements on the web page, and view the HTML source code of the entire web page.

HTML basic structure

basic structure

Web pages are written by us through the HTML language. There are some structures that must exist by default when writing web pages in HTML language. We call this structure the web page (HTML) skeleton.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
​
</body>
</html>

HTML basic tags

Label

Tags are some "words" artificially defined by the inventor of the HTML language, and different tags represent different functions.

Labels come in two common forms:

  • Double tab:<标签名称></标签名称>
  • Single label:<标签名 />

common labels

todo: Join demo (done)
  • <!DOCTYPE html>: declares to the browser that the current document is of type HTML
  • <html> The text between and  </html> describes the web page, <html>which is the largest tag in the web page, called the root tag
  • <head> With  </head> the description of the web page header, the content inside is written for the browser to read
  • <meta charset="UTF-8"> Indicates that the display encoding of the current web page is set
  • <title> The text between and  </title> is the title of the web page, and the content inside will be displayed on the tab page of the browser
  • <body> The text between and  </body> is the main body of the webpage, and the content inside will be displayed in the blank area of ​​the browser
  • <div></div> Defines a separator block or section of a region in a web page between  and 
  • <h1> The text between and  </h1> is displayed as the title
  • <p> Text between and  </p> is displayed as a paragraph
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>网页标题</title>
  </head>
  <body>
    <div>
      <h1>我的第一个网页</h1>
      <p>网页中的内容</p>
    </div>
  </body>
</html>

properties of the label

todo: join demo(done)

HTML tags can have attributes. Attributes provide more information about HTML elements. Properties always appear as name/value pairs, like this: name="value".

The basic format of an attribute is:<标签名 属性1="属性值1" 属性2="属性值2"></标签名>

Each tag can have multiple attributes. Attributes must be written in the opening tag, after the tag name. There is no order distinction between attributes. Use spaces to separate tag names from attributes, and attributes from attributes. Any attribute has a default value, omitting this attribute means using the default value.

In HTML, there are many attributes, such as global attributes, which can be used by all tags. Then there are event attributes, and events can be understood as different operations. In different operations, there are also special properties that can be defined. Finally, there are some unique properties of each tag.

For example, common global attributes are:

  • class: specifies the class name of the element
  • id: specifies the unique id of the element
<! DOCTYPE html>
<html lang="en">
   <head>
     <meta charset="UTF-8" />
      <title>网页标题</title>
    </head>
    <body>
      <div id="first" class="content">网页中的内容</div>
     </body>
   </html>

Finally:  In order to give back to the die-hard fans, I have compiled a complete software testing video learning tutorial for you. If you need it, you can get it for free 【保证100%免费】

How to obtain the full set of materials: Click the small card below to get it yourself

 

Guess you like

Origin blog.csdn.net/weixin_57794111/article/details/131611498