任务四主线

HTML页面结构

  • 关于HTML:超文本标记语言,简称HTML,是一种用于创建网页的标准标记语言。HTML是一种基础技术,常与CSS、Javascript一起被众多网站用于设计令人赏心悦目的网页、网页应用程序以及移动应用程序的用户界面。网页浏览器可以读取HTML文件,并将其渲染成可视化网页
  • 发展:HTML3.2—HTML4.0—HTML4.01—HTML5(2014.10)
  • 一个典型的HTML5/4页面
  • HTML vs XML vs XHTML
    • HTML,超文本标记语言,是语法较为松散的、不严格的Web语言;
    • XML,可扩展标记语言,主要用于存储数据和结构参考(用于传输数据,需要自行定义标签)
    • XHTML,可扩展超文本标记语言,基于XML,作用与HTML类似
  • 表现内容、样式、行为分离
    • 写HTML的时候先不管样式,重点放在HTML的结构和语义化上,让HTML能体香页面结构或者内容,之后再去写样式
    • 写JS的时候,尽量不要用JS去直接操作样式,而是通过给元素添加删除class来控制样式变化
    • HTML内不允许出出现属性样式,尽量不要出现行内样式
  • 语义化HTML
    • 语义化HTML是一种编写HTML的方式,选择合理的标签、使用合理的代码结构,便于开发者阅读,同时让浏览器的爬虫和机器很好的解析

HTML常见标签(1)

标签 含义
h1~h6 标题,h1代表页面最大的标题,h2代表二级标题。。。
p 段落,表示大段文字
a 链接,链接到一个地址
href=“#”某点,”#about”跳到页面上这一点,”/getCourse”相对路径
target=“_blank”在新窗口打开,默认在当前页面刷新;“mypage”在页面嵌入的小框里面打开新页面
title=”“在不去点击的的情况下展示的文字
img 展示一张图片
src=‘地址’
alt=‘’万一地址有问题展示一点东西,或者也可以备注
只闭合标签,前面不需要加“/”
div 语义为“一大块”,用于划分区块,使页面更加清晰
id=“header””content””footer”;id:给一个元素起个名字,唯一的,相当于身份证号,每个id就是不一样的,根据当前的整个功能去写
class:代表一类的东西,不同元素都可以叫一个class
ul, li 无序列表,用于表示并列的内容;ul的直接元素是li,可以嵌套;常常一起使用;ul的直接子元素就是li
ol, li 有序列表,用于表示带有步骤或者编号的并列内容
dl, dt, dd 用于展示一系列“标题:内容”的场景
button 按键
strong 非常重要
em 需要强调一下
span 对于块级元素,相对里面的一些东西进行一些控制,只是在上面加一些标记

HTML常见标签(2)

标签 含义
iframe 用于嵌入一个页面,注意跨域操作问题(假如说当前的地址是同一个域名,后期可以用JS获取;但是如果不一样,只能获取)
table 展示表格,不要用来做布局,thaed,tbody,tfoot,tr(一行),td(一列),th(表头的一列)
!DOCTYPE 文档对象模型,用HTML的标准来解析整个页面;混杂模式:不加,浏览器以自己的宽松方式去进行渲染;标准模式:加
html lang告诉浏览器用什么语言;当前是德语页面要不要翻译成中文,浏览器就谁根据这句话来看的
head 头信息,和内容展示无关的信息
meta:charset=网络编码,会保存为一种编码格式,utf-8或者GBK,打开后需要把编码解析,如果猜对了就会好好展示,猜错了就是乱码
http-equiv=;content=“”用什么内核来渲染当前页面
name=“viewpoint” content=“”在移动端展示的时候会比较合理
name=“description”,content=““;name=”keywords“,content=”“,搜索引擎友好
  • 注意
    • 标签属性全部小些
    • 标签要闭合,自闭合标签可以省略/
    • 标题里不能有段落,段落里不能有标题
  • 块级元素和行列元素
    • 检查
    • 块级元素需要占据整整一行;行列元素就只有它需要的那一点;
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 简介网络浏览器很可能是使用最广的软件。在这篇入门文章中,我将会介绍它们的幕后工作原理。我们会了解到,从您在地址栏输...
    wengjq阅读 2,118评论 2 15
  • 什么是html? html是一种网页标记语言,叫超文本标记语言,我们平时上网所看到的所有网页均来自于html,英文...
    波段顶底阅读 8,465评论 2 7
  • HTML基础 本文包括 HTML基本知识与结构 HTML常见标签 标签写法与嵌套的讨论 HTML、CSS、java...
    廖少少阅读 2,140评论 2 21
  • 1. 介绍 浏览器可能是最广泛使用的软件。本书将介绍浏览器的工作原理。我们将看到,当你在地址栏中输入google....
    康斌阅读 2,086评论 7 18
  • 昨天和朋友去看了新版《倩女幽魂》。 很奇怪,写这篇博客时竟然已经不太记得故事情节。。。 印象深刻的唯有这句宁采臣与...
    高小花0218阅读 275评论 0 0