day44前端开发1之html基础

web前端开发1
一.前端三剑客之html
1.为标记语言,是非编程语言
2.自身不具备逻辑,遇到负责重复操作只能全部手写(Ctrl+C > V)
3.组成:标签, 指令, 实体
标签:由<>包裹,以字母开头可以结合合法字符可以被浏览器解析的标记(纯字母或字母与数字组合)
  <zero>小VV</zero>
指令:被<>包裹,以!开头的可以被浏览器解析的标记
  <!dcotype> 
实体:被&;包裹的#开头的十进制数或特殊字母组合
  <zero>
文档类型:规定该页面的标签遵循的html语法(h5)
  <!doctype html>
二.第一个页面



<!doctype html>

<html>


  <head> 主要放的是功能
   
   
   <meta charset="utf-8" />
   
   <meta name="keywords" content="培训,Python培训,IT培训,peixun" />
   <meta name="description" content="老男孩皇家培训机构" />
   
   <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
    网站的图标
   
   <link rel="shortcut icon" type="image/x-icon" href="icon.png">
   <title>第一个页面</title>
  </head>
  <body> 主要放的是内容
   
  </body>
</html>




三.常用标签
1.head内相关标签
  1、指定字符集(字符编码)
   <meta charset="gbk">
  2、页面描述
   <meta name="Description" content="具体描述。。。">
  3、关键字：有助于搜索引擎SEC优化，再怎么优化也抵不过竞价排名
   <meta name="Keywords" content="网易，邮箱，游戏，新闻">
  4、3秒后跳转(了解)
   <meta http-equiv="refresh" content="3,http://www.baidu.com">
  5、三秒刷新(了解)
   <meta http-equiv="refresh" content="3">
  6、移动适配 (了解)
  7、标题
   <title>百度一下，你就知道</title>
  8、网站的图标
   <link rel="icon" href="https://www.baidu.com/favicon.ico">
  9、定义内部样式
   <style></style> (css定制当前了解)
  10、引入外部样式文件(css定制,引入css文件当前了解)
   <link rel="stylesheet" href="mystyle.css">
  11、定义JavaScript代码或引入JavaScript文件(js定制,引入js文件当前了解)
   <script src="hello.js"></script>　
2.body内相关标签
  1.无语义标签 (css重点介绍)
   div:最常用的标签,没有之一
    <div></div>
   span:最常用的纯文本标签
    <span></span>
  2.常用语义标签
   1.标题:h1~h6
    h1标签较经常出现,作为页面最大title形式出现,且一个页面一般只出现一次
     <h1>一级标题</h1>
     <h2>二级标题</h2>
     <h6>六级标题</h6>
   2.br:换行 | hr分割线
    <br>好<br>的<br>   <hr>呵<hr>呵<hr>
  3.文本标签
   i和em:很常用的标签,一般不作为斜体文本使用,作为字体图片使用,原因写法简单
   <i>斜体</i>    <em>以斜体方式强调</em>
   <b>加粗</b>    <strong>以加粗方式强调</strong>
   p:段落标签具有具体区域,成段出现,段落之间存在段落间距
   <p>段落</p>
   per原样文本标签:会保留所有字符,原样显示
   <pre></pre> ܻ
   ins和u:样式具有下划线
   <ins>插入的文本强调且有下划线</ins> <u>插入的文本具有下划线</u>
   <del>删除的文本</del>     <s>删除的文本</s>
   在html5中
    strong == b
    ins == u
    em == i
    del == s
    新的标签是有语义的，而老的只是单纯的添加样式（这是CSS干的事）
     strong的语义：定义重要性强调的文字
     ins的语义（inserted）：定义插入的文字
     em的语义（emphasized）：定义强调的文字
     del的语义（deleted）：定义被删除的文字
   sup上标子
   <span>10<sup>2</sup></span>
   sub下标子
   <span>H<sub>2</sub>O</span>
   small右标:小号字体
   <span>你很帅<small>谁信</small></span>
   注明拼音
   <ruby>牛掰<rt>niubai</rt></ruby>
四.标签分类
1.单双标签 -->



2.行块标签 -->




3.单一组合标签 -->
<!-- 组合标签必须组合出现,协同下才能显示产生相应的内容与效果

转载于:https://www.cnblogs.com/wu-jia/p/9677698.html

day44前端开发1之html基础相关推荐

2018年最全微专业之前端开发工程师：零基础完成MIni项目开发
课程目录 CSS基础.zip DOM编程艺术.zip HTML入门.zip JavaScript程序设计.zip JavaScript入门.zip we ...
从零开始学习前端开发 — 2、CSS基础
一.CSS简介 1.CSS是什么 CSS是Cascading Style Sheets的简称,中文称为层叠样式表.特点:实现了表现与结构相分离 2.css基础语法 css是由选择符和声明两大部分组成 ...
【Web前端开发】《零基础入门学习Web开发》（HTML5CSS3）（小甲鱼）
1 P1:凉凉好像挺厉害的奥? 听完了! 2 P2:HTML是用来描述网页的一种语言官方:超文本标记语言 Hyper Text Markup Language 使用标签来描述网页 ...
Web前端开发代码规范（基础）
一. 引言对于一个多人团队来说,制定一个统一的规范是必要的,因为个性化的东西无法产生良好的聚合效果,规范化可以提高编码工作效率,使代码保持统一的风格,以便于代码整合和后期维护. 二. HTML/CS ...
〖前端开发〗HTML/CSS基础知识学习笔记
经过一天的学习,把慕课网的HTML/CSS基础知识学完了,笔记整理: 1. 文件结构:HTML文件的固定结构:<html><head>...</head><b ...
从零开始学习前端开发 — 1、HTML基础
一.web标准 web标准-网页制作的标准,它是由一系列标准组成的,主要包含三个方面:结构(html,xhtml),表现(css),行为(javascript) 注:结构和表现的标准由w3c(万维网联 ...
html 标签开发,前端开发入门之HTML基础标签一
HTML元素指的是从开始标签到结束标签的所有代码 ps:开始标签常被称为开放标签(opening tag),结束标签常成为闭合标签(closing tag ) HTML元素基本格式是元素内容标签名&g ...
Web前端开发基础三剑客学习知识分享
Web前端开发基础知识学习路线分享,前端开发入门学习三大基础:HTML.CSS.JavaScript.除此之外还要学习数据可视化.Vue.React.Angular相关框架,熟练运用框架提升开发效率, ...
网站前端开发必会基础知识有哪些？
自己工作做得好好的,怎么非要去搞前端?" 很多人离职的时候,可能印象最深的就是爸妈每天说的这句话.起因很简单,就是自己辞了爸妈眼中的"铁饭碗". 他也是如此,毅然辞去了一 ...

day44前端开发1之html基础

day44前端开发1之html基础相关推荐

最新文章

热门文章