Diseño Web HTML Sobre Turismo Urbano—Turismo en China HTML+CSS+JavaScript 11 páginas con video y carrusel

Obtenga el código fuente Contacto al final del artículo


Descripción de la tecnología de desarrollo front-end web Tema de diseño web, producción de diseño DIV+CSS, tarea final del curso de diseño web HTML+CSS |
| Tarea final de diseño web para estudiantes universitarios en HTML

  1. HTML: estructura

  2. CSS: estilo
    En términos de operación, se utilizan html5 y css3, y se
    adoptan conocimientos básicos como estructura div+css, forma, hipervínculo, flotante, posicionamiento absoluto, posicionamiento relativo, estilo de fuente y video de referencia.

  3. JavaScript: hacer comportamiento interactivo con el usuario


Ruta de aprendizaje frontal

(1) archivo html: donde index.html es la página de inicio y otro html es la página de segundo nivel; (
2) archivo css: css todos los estilos de página, desplazamiento de texto, zoom de imagen, etc.;
(3) archivo js : js realiza efectos especiales de carrusel dinámico, envío de formularios, evento de clic, etc. (el código js se usa en páginas web)

Estructura básica de la página web.

(1) Página de inicio: la primera página que ve cuando ingresa a la página web (LOGO, nombre de la empresa, navegación, banner, noticias, información relacionada, información inferior, generalmente el banner es 5) (2) Página secundaria: después de hacer clic para ingresar desde el  
página de inicio La página se llama página de segundo nivel
(3) Página de tercer nivel: la página en la que se hizo clic desde la página de segundo nivel

Página web html : una página web es el elemento básico de un sitio web y una plataforma para llevar varias aplicaciones de sitios web.
En términos sencillos, un sitio web es una página de inicio compuesta de páginas web : la página de inicio es la
página de entrada de un sitio web, por lo que a menudo se edita para que sea más fácil de entender El área superior o lateral, también conocida como la barra de navegación , desempeña la función de vincular varias páginas en el sitio o software
Pie de página de la página web : Es el área en la parte inferior de cada página en la página web. A menudo se utiliza para mostrar información adicional. Como autor, número de registro, etc.


demostración web

inserte la descripción de la imagen aquí
inserte la descripción de la imagen aquí
inserte la descripción de la imagen aquí
inserte la descripción de la imagen aquí
inserte la descripción de la imagen aquí
inserte la descripción de la imagen aquí

código de estructura HTML



<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="css/style.css" />
<title>中国旅游</title>
</head>
<body>
<header class="head">
  <div> <img src="images/logo.png"> <span class="bda"> <a href="zhuce.html">注册</a> |  <a href="denglu.html">登录</a> </span></div>
</header>
<nav class="menu">
  <ul class="center">
    <li><a href="index.html">网站首页</a></li>
    <li><a href="sichuan.html">四川旅游 </a></li>
    <li><a href="yunnan.html"> 云南旅游 </a></li>
    <li><a href="xizang.html">西藏旅游</a></li>
    <li><a href="tuijie.html">推荐旅游</a></li>
  </ul>
</nav>
<div class="content">
  <marquee>
  欢迎来到中国旅游,开启新的旅程吧!
  </marquee>
  <div class="banner">
    <div class="banner_box  ">
      <div class="box-1">
        <ul>
          <li><img src="images/banner1.jpg"></img></li>
          <li><img src="images/banner2.jpg"></img></li>
          <li><img src="images/banner3.jpg"></img></li>
          <li><img src="images/banner4.jpg"></img></li>
          <li><img src="images/banner5.jpg"></img></li>
        </ul>
      </div>
      <div class="box-2">
        <ul>
        </ul>
      </div>
    </div>
  </div>
</div>
<div class="content">
  <div class="clear"></div>
  <div class="bar"><strong>热门景区</strong> </div>
  <div class="pics scrollleft">
    <ul>
      <li> <b><img src="images/a1.jpg" /></b>
        <h3><a href="info.html">故宫博物馆</a></h3>
        <p> 北京故宫博物院建立于1925年10月10日,位于故宫博物院北京故宫即紫禁城内。是在明朝、清朝两代皇宫及其收藏的基础上建立起来的中国综合性博物馆,也是中国最大的古代文化艺术博物馆。 </p>
      </li>
      <li> <b><img src="images/a2.jpg" /></b>
        <h3><a href="info.html">颐和园</a></h3>
        <p> 颐和园位于中国北京市西北海淀区,占地290公顷(合4400亩),是一座巨大的皇家园林和清朝的行宫。修建于清朝乾隆年间、重建于光绪年间,曾属于清朝北京西郊三山五园之一。</p>
      </li>
      <li> <b><img src="images/a3.jpg" /></b>
        <h3><a href="info.html">平遥古城</a></h3>
        <p> 位于山西中部平遥县内,是一座具有2700多年历史的文化名城,与同为第二批国家历史文化名城的四川阆中、云南丽江、安徽歙县并称为“保存最为完好的四大古城”</p>
      </li>
      <li> <b><img src="images/a4.jpg" /></b>
        <h3><a href="info.html">长白山</a></h3>
        <p> 长白山犹如一条鳞光闪烁的巨龙,巍峨磅礴,横卧天际。是我国与五岳齐名、名光秀丽、景色迷人的关东第一山,因其主峰白头山多白色浮石与积雪而得名,素有"千年积雪为年松,直上人间第一峰"的美誉。</p>
      </li>
      <li> <b><img src="images/a5.jpg" /></b>
        <h3><a href="info.html">庐山</a></h3>
        <p> 庐山以雄、奇、险、秀闻名于世,素有“匡庐奇秀甲天下”之美誉。巍峨挺拔的青峰秀峦、喷雪鸣雷的银泉飞瀑、瞬息万变的云海奇观、俊奇巧秀的园林建筑,一展庐山的无穷魅力。</p>
      </li>
      <li> <b><img src="images/a6.jpeg" /></b>
        <h3><a href="info.html">五台山 </a></h3>
        <p> 中国佛教及旅游胜地之一。与四川峨嵋山、安徽九华山、浙江普陀山共称“中国佛教四大名山”。与尼泊尔蓝毗尼花园、印度鹿野苑、菩提伽耶、拘尸那迦并称为世界五大佛教圣地</p>
      </li>
    </ul>
  </div>
  <div class="clear"></div>
  <div class="ad"><img src="images/ad.jpg" width="100%"></div>
  <div class="bar"><strong>摄影美图 </strong></div>
  <div id="div1">
    <ul id="ul">
      <li class="li"><img src="images/1.jpg"></li>
      <li class="li"><img src="images/2.jpg"></li>
      <li class="li"><img src="images/3.jpg"></li>
      <li class="li"><img src="images/4.jpg"></li>
      <li class="li"><img src="images/5.jpg"></li>
      <li class="li"><img src="images/6.jpg"></li>
      <li class="li"><img src="images/7.jpg"></li>
      <li class="li"><img src="images/8.jpg"></li>
      <li class="li"><img src="images/9.jpg"></li>
    </ul>
  </div>
  <div class="clear"></div>
</div>
<footer class="end">
  <p>xxx版权所有</p>
  <p>本地时间:<span id="localtime"><font color="#000000">2021-12-11 16:17:22  星期六</font></span></p>
</footer>
<script type="text/javascript" src="js/js.js"></script>
<script type="text/javascript" src="js/gundong.js"></script>
<script type="text/javascript" src="js/time.js"></script>
</body>
</html>



Cuanto más aprendes, más confundido te vuelves

Es normal sentirse así, porque realmente no has estado en la empresa y no sabes cuánto necesitas aprender para ser competente en el trabajo que se te ha asignado en la empresa. Puedo ver por su declaración que sus cimientos aún deben ser muy sólidos. Definitivamente no hay problema para seguir el conjunto completo de tutoriales en video en Internet.

Cuando ingrese a la empresa en el futuro y descubra que la dificultad y la cantidad de trabajo son solo alrededor del 20% de su período de estudio, puede suspirar: Entonces, el trabajo no es más que eso.

Esto es normal, porque la mayoría de las empresas lo contratan para trabajar y escribir negocios, no para permitirle ser un recién llegado para desarrollar la estructura de la empresa. Son todas cosas prefabricadas, lo que tienes que hacer es agregar ladrillos y tejas bajo la guía de otros y dirigirlos de la mano. En ese momento, me temo que exclamarás: ¿Esto es todo?

Entonces, relájate y disfruta de tu tiempo universitario
—————————————————


aprende más

Sígueme | Dar me gusta a las publicaciones del blog | Llevarte a aumentar tus conocimientos todos los días


inserte la descripción de la imagen aquí

Supongo que te gusta

Origin blog.csdn.net/m0_65484028/article/details/127868914
Recomendado
Clasificación