HTML-入门篇day01

1、web
     C/S：Client Server
    客户端 服务器
    QQ,...
    B/S：Browser Server
    浏览器 服务器

PC机:Personal Computer 个人电脑

2、HTML
   2. 1、HTML:Hyper Text Markup Language
            超级 文本 标记 语言
            通过 带有 尖括号<>组成的标记将网页内容标识出来

用于设计网页的语言
            以.html或htm为后缀
            由浏览器解释执行
  开发工具:
     1、记事本等相关工具
          Editplus hubilder
    2、浏览器
         Chrome  火狐
3、HTML语法
    标记：一组用于描述HTML功能的符号<p></p>
   语法：标记必须用<>扩起来
    标记分为 封闭类型的，非封闭类型的
    <>内的东西 就是标记内容,不同的标记页面会有不同的显示效果
   <a>:超链接
    <b>:字体加粗显示

1、封闭类型的标记
         也称为双标记：必须成对出现
        <标记> 内容 </标记>
        <b>这是一个b标记</b>
    2、非封闭标记
       称为 空标记、单标记
      <标记>或<标记/>
     空标记一般用于表示特殊效果
    <br> : 换行
     <hr> : 一条水平线
    <img /> : 显示图片
   3、元素
      也称为标记
     <body></body>
      元素之间是可以产生嵌套的
a：超链接
img：图片
<a>
<img ... />
</a>
注意：标记的嵌套顺序
<p>
<a>超链接</a>
</p>
<p>
<a> fdsaf
</p>
</a>

4、元素的属性和值
   属性是用来修饰元素的
   语法：
 4.1、属性声明必须位于开始标记中
 <标记 属性声明位置></标记>
 <标记 属性声明位置/>
 4.2、一个元素允许出现多个属性，多个属性用空格区分.第一个属性也要与标记用空格来区分
  <标记 属性1 属性2 属性3></标记>
 4.3、属性间排名不分先后
    属性值:
       1、属性与属性值之间用=连接
       2、属性值尽量放在一对引号中' ' " "
    <p align='center' id="p1">段落一</p>
   属性：align
   值：center
   align='center'
   增加一个属性 名称为 id，值为p1

标准属性：
    又称通用属性，所有的html标记都会具备的属性
   id:定义元素在页面中的唯一标识
   title:鼠标移入到当前元素时，所提示的文本
   class:引用的样式的类名称
  style:定义行内样式
5、注释
      html的注释内容是不会被浏览器所解析显示的。
   语法：
   <!--
   注释内容
   是不会被浏览器解析的
   但是可以给其他人员查看
     -->

3、文本相关标记
1、文本标记的作用
不同的文本标记会文本有不同的显示效果
2、特殊字符
&nbsp; :一个空格
&gt; > greater than
&lt; < less than
&copy; ©

3、文本相关标记
1、文本标记的作用
不同的文本标记会文本有不同的显示效果
2、特殊字符
&nbsp; :一个空格
&gt; > greater than
&lt; < less than
&copy; ©
3、文本相关的标记
1、文本样式
<b></b> 加粗
<i></i> 斜体
<u></u> 下划线
<s></s> 删除线
<sup></sup>上标
<sub></sub>下标
2、标题元素
<hn></hn>
n:1-6之间的数字
<h1></h1>一级标题 ，字最大
<h6></h6>六级标题，字最小
3、段落元素
<p></p>
4、换行元素
<br>
<br />
5、分区元素
1、行分区
<span></span>
主要作用是包裹文本，做文本的样式
2、块分区
<div></div>
div的主要工作，就是布局
没有显示效果，主要用于页面的布局或分组
6、行内元素和块级元素
1、行内元素可以同其他的行内元素在一行内显示
<b></b> 加粗
<i></i> 斜体
<u></u> 下划线
<s></s> 删除线
<sup></sup>上标
<sub></sub>下标
<span></span>

特点：修改文本样式
2、块级元素
默认情况，块级元素独占一行，前后会自动换行
<div></div>
<hn></hn>
<p></p>

特点：主要场合是在 布局上
注意：
1、所有的行内元素不允许嵌套块级元素
<span>
<h1></h1>
</span>
2、块级元素中可以嵌套所有的行内元素
p标记是不允许嵌套其他块级元素
div：允许嵌套所有的元素
div没有特殊情况是不允许被其他元素嵌套的
div 能嵌套div
td 能嵌套div
li 能嵌套div
dt,dd 能嵌套div
7、分割线元素
<hr>
属性：size 尺寸
width 宽度
align 水平对齐方式
color 颜色

8、预格式化
保留源文档的格式，即保留文档中出现的空格和回车
<pre></pre>

<p><a>内容</a></p>
<p>
<a>
<b>内容</b>
</a>
</p>

Tab
<pre>
<p>
<a>
<img />
</a>
</p>
</pre>

HTML-入门篇day01的更多相关文章

  1. Membership三步曲之入门篇 - Membership基础示例

    Membership 三步曲之入门篇 - Membership基础示例 Membership三步曲之入门篇 -  Membership基础示例 Membership三步曲之进阶篇 -  深入剖析Pro ...

  2. spring boot(一)：入门篇

    构建微服务:Spring boot 入门篇 什么是spring boot Spring Boot是由Pivotal团队提供的全新框架,其设计目的是用来简化新Spring应用的初始搭建以及开发过程.该框 ...

  3. 1. web前端开发分享-css,js入门篇

    关注前端这么多年,没有大的成就,就入门期间积累了不少技巧与心得,跟大家分享一下,不一定都适合每个人,毕竟人与人的教育背景与成长环境心理活动都有差别,但就别人的心得再结合自己的特点,然后探索适合自己的学 ...

  4. 一个App完成入门篇（七）- 完成发现页面

    第七章是入门篇的倒数第二篇文章了,明天整个APP将进入收官. 本节教程主要要教会大家使用二维码扫描和用do_WebView组件加在html页面. 导入项目 do_WebView组件 扫描功能 自定义事 ...

  5. [原创]Linq to xml增删改查Linq 入门篇：分分钟带你遨游Linq to xml的世界

    本文原始作者博客 http://www.cnblogs.com/toutou Linq 入门篇(一):分分钟带你遨游linq to xml的世界 本文原创来自博客园 请叫我头头哥的博客, 请尊重版权, ...

  6. 转：OSGi 入门篇：模块层

    OSGi 入门篇:模块层 1 什么是模块化 模块层是OSGi框架中最基础的一部分,其中Java的模块化特性在这一层得到了很好的实现.但是这种实现与Java本身现有的一些模块化特性又有明显的不同. 本文 ...

  7. 转：OSGi 入门篇：生命周期层

    OSGi 入门篇:生命周期层 前言 生命周期层在OSGi框架中属于模块层上面的一层,它的运作是建立在模块层的功能之上的.生命周期层一个主要的功能就是让你能够从外部管理应用或者建立能够自我管理的应用(或 ...

  8. 【three.js详解之一】入门篇

    [three.js详解之一]入门篇   开场白 webGL可以让我们在canvas上实现3D效果.而three.js是一款webGL框架,由于其易用性被广泛应用.如果你要学习webGL,抛弃那些复杂的 ...

  9. [Maven]Apache Maven 入门篇

    作者:George Ma 上 写这个 maven 的入门篇是因为之前在一个开发者会的动手实验中发现挺多人对于 maven 不是那么了解,所以就有了这个想法.这个入门篇分上下两篇.本文着重动手,用 ma ...

  10. Unity3D大风暴之入门篇（海量教学视频版）

    智画互动开发团队 编   ISBN 978-7-121-22242-9 2014年2月出版 定价:79.00元 328页 16开 编辑推荐 长达800分钟的高清教学视频,手把手教会初学者 数个开发案例 ...

随机推荐

  1. 我和struts2 的第一天

    文字解析 1.获取正文请求 2.根据请求做出判断 3.执行具体的方法代码 4.跳转页面,展示给用户 Strut 是Apache发行的MVC框架 他只是表现层的框架 Strut1 是2005年流行的框架 ...

  2. CentOS7中编译安装redis5.0

    1. 环境介绍 CentOS7 (未安装Development Tools) 2. 下载Redis5.0-rc3 wget -O redis-5.0-rc3.tar.gz https://github ...

  3. bootloader新的理解

    1.对于bootloader这样的程序,作为板卡刚开始启动的部分,大致的顺序是一致的,大部分都是分为两个部分,一部分是汇编编写的,一部分是用c语言编写的.一般在汇编部分完成各种初始化的操作,比如关闭看 ...

  4. Delphi: 圆形进度(环形进度)

    起源: 重回DC5项目,资源下载美工提供圆形进度条,复习Delphi,为实现其颇觉有趣,遂研究其. 最终效果图如下: 实现: 制作TCircleProgress控件,实现方法参照系统之TGauge控件 ...

  5. 【校招面试 之 网络】第2题 TCP的可靠传输、流量控制、滑动窗口

    1.可靠传输 (1)三次握手 TCP/IP协议中,TCP协议提供可靠的连接服务,采用三次握手建立一个连接: (1)第一次握手:建立连接时,客户端A发送SYN包(SYN=j)到服务器B,并进入SYN_S ...

  6. VS unable to update auto-refresh path。。。。

    手工创建提示报错的路径,重新生成,成功

  7. Android studio实现简单的CRUD

    1.打开Android studio ,创建项目DataBase01 2.进行UI设计,如图 目的:实现对姓名及其爱好的增删改查 3.创建DB.java,用于创建数据库,并做相关操作 在该目录下右键- ...

  8. Activity 的启动过程深入学习

    手机应用也是一个app,每一个应用的icon都罗列在Launcher上,点击icon触发onItemClick事件. 我们要启动「淘宝」这个App,首先我们要在清单文件定义默认启动的Activity信 ...

  9. 26-算法训练 Torry的困惑(基本型) 素数打表

      算法训练 Torry的困惑(基本型)   时间限制:1.0s   内存限制:512.0MB      问题描述 Torry从小喜爱数学.一天,老师告诉他,像2.3.5.7……这样的数叫做质数.To ...

  10. C#使用MiniDump捕获异常

    c/c++语言里MiniDump是一个重要的调试手段,他们没有C#/java这样语言有很多异常输出信息( JVM异常导出bug日志功能,通常在jdk目录,文件格式hs_err_%pid%.log,pi ...