响应式web开发chapter2/2-1

庒

已于 2022-03-06 19:49:17 修改

阅读量771

点赞数

文章标签： css html5

于 2022-03-04 21:23:26 首次发布

本文链接：https://blog.csdn.net/weixin_54042448/article/details/123285632

版权

css文件/百度网盘链接

css文件，下载解压之后放置2-1文件夹下，与index.html文件一层。

2-1/index.html文件

<!DOCTYPE html>
<html>
   <head>
      <meat charset="UTF-8">
      <title>广告软文推广页面 </title>
      <link href="css/advertising.css" rel="stylesheet" type="text/css"/>
      <link href="css/font-awesome.min.css"
      rel="stylesheet"type="text/css">
      

   </head>

   <body>
     <section class="container">
         <h1>万物互联，极致体验</h1>
     </section>
     <section class="middle">
         <h2>HTML5+CSS3</h2>
         <ul>
             <li>
                 <p>
                     <i class="fa fa-html5 fa-5x"></i>
                 </p>
                 <p>
                    【HTML5】HTML5不仅仅是HTML规范的当前最新版本，
                    HTML5进化的重大意义还在于HTML5从技术层面带来了八个类别的革新，
                    HTML5规范以“用户至上”为宗旨。也就是说在遇到冲突时，
                    规范的优先级为：用户＞页面作者＞实现者（浏览器）＞规范开发名（W3C/WHATWG）＞纯理论。
                    除此之外，HTML5还引入了一种新的安全模型来保证HTML5足够安全，  
                
                 </p>
             </li>
             <li>
                 <p>
                     <i class="fa fa-css3 fa-5x"></i>
                 </p>
                 <p>
                    【CSS3】CS53是CSS的当前最新版本，该版本提供了更加丰富且实用的规范。
                    在Web开发中采用CSs3技术将会美化页面，
                    显著的提高用户体验，同时也能极大的提高程序的性能：
                    例如列表模块、超链接、语言模块、背景和边框，颜色，文字特效，多栏布局和动画
                    等等。
                 </p>
             </li>
         </ul>
     </section>
     <section class="footer">
         <h2>平台支持</h2>
         <ul>
             <li>
                 <i class="fa fa-apple fa-3x"></i>
                 <h5><a href="#">原生移动APP开发</a></h5>
             </li>
             <li>
                <i class="fa fa-apple fa-3x"></i>
                <h5><a href="#">微信公共平台</a></h5>
            </li>
            <li>
                <i class="fa fa-apple fa-3x"></i>
                <h5><a href="#">网络开发</a></h5>
            <li>
                <i class="fa fa-apple fa-3x"></i>
                <h5><a href="#">桌面应用开发</a></h5>
            
             
         </ul>
     </section>
     
   </body>



</html>