zoukankan      html  css  js  c++  java
  • 前端html/css/script基础

    1. 基础模板
           <!DOCTYPE html>
           <html>
               <head>
                   <meta charert="utf-8" />
                   <title>第一个页面</title>
               </head>
               <body>
                   day01
                   第一个页面
               </body>
           </html>
    2. 模板解读
       - <DOCTYPE>:指定文档类型,是文档声明,必须写在html文档的第一行,位于<html>标签之前,表明该文档是html5标签,规定html标签语法。
       - <html>:文档根标签,标注着文档(页面)的开始与结束。
         html的lang属性可用于网页或部分网页的语言。通常用于搜索引擎和浏览器的统计分析,不定义也没有什么影响。
         根据W3C推荐标准,您应该通过<html>标签中的 lang 属性对每张页面中的主要语言进行声明,比如:
             <html lang="en"></html>
       - <head>:文档的开头,可以引用脚本文件、指定样式表、书写逻辑代码块、提供元素信息。包含了文档的与智能数据(meta),如<meta charert="utf-8" /> 定义网页编码格式为utf-8。
       - body:文档主体标签,包含文档所有文本与从超文本内容
       - title:文档tag标题标签,设置文档tag的标题内容
         
    3. meta(元标签)
           字符编码
           <meta charset="utf-8">
           <meta http-equiv="content-type"
           conntent ="text/html;charset=utf-8"/>
           SEO
           <meta name="keyword" content="8到12个以英文逗号隔开的单词或词语">
           <meta name="descreption" content="80字以内的一段话,与网站内容相关">
           移动适配
           <meta name="viveport" content="width=device,initial-scale=1,minium-scale=1,user-scaleble=no"/>
    4. html标签纤细语法与注意点
       - 标签的语法:
         <标签名  属性1=“值1” 属性2=“值2”........>内容部分</标签名>
         <标签名  属性1=“值1” 属性2=“值2”........./>
    5. html标签分类及语义
           1. <br> :换行
           2. <hr> :分割线
           3. <font> :修改文字大小,颜色
               <font color="red" size="10px">岂能尽如人意</font>
           4. <u> :下划线
           5. <i> :倾斜
           6. <s> :下划线
           6. <b> :加粗
               <b>论颜值,我秒杀宇宙</b>
    6. 字符实体
       html特殊符号对照表
       注意:实体名称对大小写敏感
         内容      代码    
         空格      &nbsp;
         >       &gt;  
         <       &lt;  
         &       &amp; 
         ¥       &yen; 
         版权      &copy;
         注册      &reg; 
    7. h系列标签
       语义:标记内容为一个标题,全称headline
       h系列标签从h1-h6共6个,没有h7标签,标记内容为1~6级标题,h1用作主标题(代表最重要的),其实是h2。。。
       虽然h1-h6标签的显示样式是从大到小,但再次强调:记忆HTML标签的显示样式是没有意义的
           <!DOCTYPE HTML>
           <html>
               <head lang='en'>
                   <meta charset="utf-8">
                   <title>Egon才华无敌</title>
               </head>
               <body>
                   <h1>一级标题</h1><h2>二级标题</h2>
                   <h3>三级标题</h3>
                   <h4>四级标题</h4>
                   <h5>五级标题</h5>
                   <h6>六级标题</h6>
                   <h7>没有七级标题</h7>
                   没有七级标题
               </body>
           </html> 
    8. p标签
       语义:标记内容为一个段落,全程paragraph
           <!DOCTYPE HTML>
           <html>
               <head lang='en'>
                   <meta charset="utf-8">
                   <title>Egon无敌</title>
               </head>
               <body>
                   <h1>Egon</h1>
                   <p>论颜值,鹤立鸡群</p>
                   <p>论才华,天下无敌</p>
               </body>
           </html>
       
  • 相关阅读:
    基于LBS(GPS)和ArcGIS的ITS智能交通 路况服务架构
    入手ipod touch4
    改2字节将Win XP Home变成Pro?!(zz)
    越来越多的同学在MSN上建Blog了……
    有了64位的芯不一定能运行64位OS?(zz)
    C++字符串完全指引之二——字符串封装类(zz)
    忙……
    注意C#中的ref及out关键字
    期待CGFTP 1.0正式版:)
    真伪双核 英特尔双核平台深度揭秘(zz)
  • 原文地址:https://www.cnblogs.com/zhaijihai/p/9682030.html
Copyright © 2011-2022 走看看