? Get the source code, contact at the end of the article ?
Web front-end development technology
Description Web design theme, DIV + CSS layout production, HTML + CSS web design final course homework | hometown tourist attractions | hometown people’s livelihood changes | Web Design Assignments for College Students
-
HTML: structure
-
CSS: styles
In terms of operation, html5 and css3 are used,
Basic knowledge such as div + css structure, form, hyperlink, float, absolute positioning, relative positioning, font style, reference video, etc. are adopted -
JavaScript: do interactive behavior with the user
Article directory
- Front-end learning route
- Basic structure of web page
- web demo
-
- HTML structure code
- The more you learn, the more confused you become
- learn more
Front-end learning route
(1) html file: where index.html is the home page, and other html is the second-level page;
(2) css file: all css page styles, text scrolling, image zooming, etc.;
(3) js file: js realizes dynamic carousel effects, form submission, click events, etc. (js code is used in web pages)
Basic structure of web page
(1) Homepage: The first page you see when you enter the webpage (LOGO, company name, navigation, banner, news, related information, bottom information, and banner are generally 5.
(2) Secondary page: the page after clicking from the home page is called the secondary page
(3) Third-level page: the page clicked from the second-level page
Web page html: A web page is the basic element of a website and a platform for carrying various website applications. In layman’s terms, a website is made up of web pages
Homepage website: The homepage is the entrance page of a website, so it is often edited to make it easy to understand. Most of the files on the website as the homepage are named index plus extension
Navigation menu: refers to the area at the top or side of the page, also known as the navigation bar, which acts as a link to various pages in the site or software.
Web page footer: is the area at the bottom of each page in a web page. Often used to display additional information. Such as author, record number, etc.
Web page demo
HTML structure code
<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<div class="main">
<div class="content12">
<div class="daohang">
<div class="img"><img src="images/1.jpg"></div>
<ul>
<li class="active"><a href="index.html">Homepage</a>
<li><a href="lishiyange.html">History</a>
\t </li>
<li><a href="renkou.html">Population</a>
\t </li>
<li><a href="fengjingmingsheng.html">Scenic spots</a>
\t </li>
<li><a href="difangtechan.html">local specialties</a>
\t </li>
<li><a href="renwuliebiao.html">Character List</a>
\t </li>
<li><a href="xuexiaoliebiao.html">School List</a>
\t </li>
</ul>
</div>
</div>
<div class="clear"></div>
<div class="content12">
<div class="guanggaotupian">
<div class="img">
<img src="images/2.jpg"></div>
</div>
</div>
<div class="clear"></div>
<div class="content3">
<div class="taitou">
<div class="title">
<div class="line"></div>
<div class="stitle">
<div class="stitle">
<div class="h2">Image display</div>
<span>TUPIANZHANSHI</span>
</div>
</div>
</div>
</div>
<div class="xiangceliebiao">
<ul>
<li>
<div class="img"><img src="images/3.jpg"></div>
</li>
<li>
<div class="img"><img src="images/4.jpg"></div>
</li>
</ul>
</div>
</div>
<div class="content9">
<div class="taitou">
<div class="title">
<div class="line"></div>
<div class="stitle">
<div class="stitle">
<div class="h2">Xingtai</div>
<span>XINGTAI</span>
</div>
</div>
</div>
</div>
<div class="xt">
<div class="text">
<div class="desc">
<p>Xingtai, referred to as "Xing", was called Xingzhou and Shunde in ancient times. It is a prefecture-level city in Hebei Province. hub
. As of 2020, the city has 4 districts, 12 counties, and 2 county-level cities under its jurisdiction.
The total area is 12,400 square kilometers, the urban built-up area is 214.84 square kilometers, the permanent population is 7,395,200, the urban population is 4,010,400, and the urbanization rate is 54.23%.
</p><p>Xingtai is located in North China, southern Hebei, Beijing-Guangzhou, Beijing-Kowloon Railway, Beijing-Guangzhou, Beijing-Kowloon High-speed Railway, Beijing-Hong Kong-Macao, Daguang, Taihang Mountain Expressway runs through the north and south; Xinghe, Xinghuang Railway, Xingheng, Xingfen, The Xinglin Expressway and Qingyin Expressway run across the east and west, forming a transportation hub with Xingtai International Inland Port and Xingtai Airport that connects the east to the west and connects the south to the north.
</p><p>Xingtai has a city history of more than 3,500 years. Humans inhabited and multiplied 50,000 to 100,000 years ago. In history, the country was established four times and the capital was established five times. The third largest city in the history of Shangjian City
, the first city in the history of North China and one of the earliest ancient capitals in China, the administrative system has not been interrupted and the city site has not been moved after more than 3,000 years. The ancient city of Xingtai is the earliest "first ancient city" built in the area north of the Yellow River, and is known as "the first city of Yanzhao".
</p><p>In the long history of Xingtai, sages such as Guo Shoujing, Li Mu, Song Jing, and Liu Bingzhong emerged, and emperors such as Guo Wei, Chai Rong, Meng Zhixiang, and Meng Chang emerged. Qin Shihuang, the first emperor through the ages, died in the sand dunes of Xingtai during his east tour
.
</div>
</div>
</div>
</div>
<div class="clear"></div>
<div class="content12">
<div class="taitou">
<div class="title">
<div class="line"></div>
<div class="stitle">
<div class="stitle">
<div class="h2">Population</div>
<span>RENKOU</span>
</div>
</div>
</div>
</div>
<div class="rk">
<div class="text">
<div class="list">
<img src="images/5.jpg" class="img">
<img src="images/6.jpg" class="img">
</div>
<br><br>In 2019, the city's total registered population was 8.0137 million, an increase of 47,000 over the end of the previous year. The urbanization rate of the registered population was 41.37%, an increase of 4.15 percentage points over the previous year. At the end of the year, the city's resident population was 7,395,200, an increase of 20,800 over the end of the previous year. The annual birth population was 76,000, and the birth rate was 11.5‰; the death population was 37,600, and the death rate was 6.1‰; the natural population growth rate was 5.4‰.
</div>
<div class="clear"></div>
<div class="list">
<img src="images/7.jpg" class="img">
<img src="images/8.jpg" class="img">
</div>
<div class="text">
In terms of urban-rural structure, the urban permanent population was 4.0104 million, an increase of 108,600 over the end of the previous year; the proportion of the urban permanent population in the total permanent population (the urbanization rate of the permanent population) was 54.23%, an increase of 1.32 percentage points over the end of the previous year.
</div>
</div>
</div>
<div class="clear"></div>
<div class="content12">
<div class="dibu">
<div class="desc">
Xingtai
</div>
</div>
</div>
<div class="clear"></div></div></body></html>
The more you learn, the more confused you become
It’s normal to feel this way, because you haven’t really been in the company, and you don’t know how much you need to learn to be competent for the work assigned to you in the company. I can see from your statement that your foundation should still be very solid. There is definitely no problem following the full set of video tutorials on the Internet.
When you actually enter the company in the future and find that the difficulty and amount of work are only about 20% of your study period, you may sigh: So the work is nothing more than that.
This is normal, because most companies recruit you to work and write business, not to let you be a newcomer to develop the company structure. They are all ready-made things. What you have to do is to add bricks and tiles under the guidance of others. At that time, I am afraid you will exclaim: This is it?
So just relax and enjoy college
—————–
Learn more
Follow me | Like blog post | Take you to increase knowledge every day
