1.HTML的相关概念

网站建设流程

网页组成

   网页主要由三部分组成:结构(Structure)、表现(Presentation)和行为(Behavior)。    

  1. html(Hypertext Markup Language)—— 结构超文本标记语言
  2. css(Cascading Style Sheets)—— 样式层叠样式表
  3. js(javascript)—— 行为

  

HTML与XHTML的最大的不同是:

  1. XHTML 元素必须被正确地嵌套。
  2. XHTML 元素必须被关闭。
  3. 标签名必须用小写字母。
  4. XHTML 文档必须拥有根元素。

第一个页面 

创建站点

站点的作用

  1. 用来归纳一个网站上所有的网页、素材以及他们之间的联系
  2. 创建站点的步骤
  3. 文件的命名规则

    文件命名规则:用英文,不用中文

    名称全部用小写英文字母、数字、下划线的组合,其中不得包含汉字、空格和特殊字符;必须以英文字母开头。

    首页必须命名为index.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Hello Word</title>
</head>

<body>
   这是我的的第一节课
</body>
</html>

HTML基本语法

  常规标签:

    <标签 属性="属性值" 属性="属性值"></标签>

  单标签:

    <标签 属性=“属性值” />

常用标签

1)文本标题
<h1>一级标题</h1>
<h2>二级标题</h2>
……
<h6>六级标题</h6>
2)段落标记
<p>段落文本内容</p>
3)空格
&nbsp;(所占位置没有一个确定的值,
这与当前字体字号都有关系。
4) <br />强制换行

5)加粗
<b>加粗内容</b>
<strong>加粗内容</strong>
6)倾斜
<em></em>
<i></i>
7)水平线/删除线/下划线
<hr /> / <del></del>/<u></u>
8)上标/下标
<sup>上标</sup>
<sub>下标</sub>

列表标签

有序列表

<ol>(ordered list)
<li></li>
<li></li>
......
</ol>

无序列表

<ul>
<li></li>
<li></li>
......
</ul>

自定义列表

dl>
<dt>名词</dt>
<dd>解释</dd> (定义描述)
......
</dl>

img标签/超链接标签

<img src="图片路径"  alt="图片名" title="图片标题"/>

alt属性 是图片名字,是给百度搜索引擎抓取使用

相对路径:../返回上一级    ./下一级

绝对路径:图片的绝对所在位置(一般不使用)

a标签: 超链接/下载/锚点
语法:
<a href="连接地址">链接文本/图片</a>
 属性: target 链接打开方式
 _blank  新窗口
 _self     当前窗口

表格table

<table>

<tr>

<td></td>

</tr>

</table>

table:表格标签      tr:行标签     td:单元格标签

width="表格的宽度"
height="表格的高度"
border="表格的边框"
bgcolor="表格的背景色"
cellspacing="单元格与单元格之间的间距"
cellpadding="单元格与内容之间的空隙"
水平对齐方式:align="left/center/right";

colspan=“所要合并的单元格的列数"合并列;

rowspan=“所要合并的单元格的行数” 合并行;

 

HTML学习 day02的更多相关文章

  1. python开发学习-day02(元组、字符串、列表、字典深入)

    s12-20160109-day02 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: ...

  2. Java学习day02

    day02-课堂笔记 1.打开DOS命令窗口,执行java HelloWorld,执行原理? * java.exe命令会启动JVM * JVM启动之后会启动类加载器ClassLoader * Clas ...

  3. Django学习day02随堂笔记

    每日测验 """ 今日考题 1.谈谈你对web框架的认识,简述web框架请求流程 2.python三大主流web框架的区别 3.安装django需要注意的事项有哪些(最少 ...

  4. 学习day02

    day021.结构标记 ***** 做布局 1.<header>元素 <header></header> ==> <div id="heade ...

  5. python学习 day02打卡

    今天主要学习的内容: 1.while 循环 :  语法: while 条件 : 循环体 #判断条件是否成立.如果成立执行循环体.然后再次判断条件...直到条件不成立石跳出循环 else : 当条件不成 ...

  6. vue学习-day02(自定义指令,生命周期)

    目录: 1.案例:品牌管理    2.Vue-devtools的两种安装方式    3.过滤器,自定义全局或私有过滤器    4.鼠标按键事件的修饰符    5.自定义全局指令:让文本框获取焦点   ...

  7. MVC学习Day02之校验

    MVC校验有两种方法: 方法一:自己动手写js---------略 方法二: l在View的页面中,首先指定页面强类型@model 类型 l使用Html.***For(model=>model. ...

  8. MVC学习Day02

    MVC中的异步请求: 方法一:使用jQuery封装的函数(例子中用的是post请求,$("#form1").serialize()讲表单中的数据序列化提交给服务端)---返回的是纯 ...

  9. python学习-day02

    ---恢复内容开始--- 一.pycharm安装 1.1破解方式http://www.cnblogs.com/evlon/p/4934705.html 1.2.头部配置: 二.运算符 2.1.比较运算 ...

  10. Mybatis学习 day02

    第十六章回顾SQL99中的连接查询 1)内连接 2)外连接 3)自连接 第十七章回顾hibernate多表开发 1)一对一 2)一对多 3)多对多 第十八章 mybatis一对一映射[学生与身份证] ...

随机推荐

  1. Java中的锁[原理、锁优化、CAS、AQS]

    1.为什么要用锁? 锁-是为了解决并发操作引起的脏读.数据不一致的问题. 2.锁实现的基本原理 2.1.volatile Java编程语言允许线程访问共享变量, 为了确保共享变量能被准确和一致地更新, ...

  2. JVM 启动调优总结

    启动命令 格式: java -jar 命令行参数 jar包路径 .示例如下 java -Dfile.encoding=utf-8 -jar -XX:MetaspaceSize=128m -XX:Max ...

  3. 不离开Emacs完成简单程序的编辑编译运行(windows或Linux)

    (1)打开Emacs (2)建立一个新的程序文件. 执行 C-x C-f, 然后在屏幕的底部出现minibuffer,光标提示你输入文件名称, 文件名称要带上后缀名,如hello.cpp.回车,然后开 ...

  4. 设计模式(五)Singleton模式

    Singleton模式就是确保只生成一个实例的模式.这里有两个意思,即想确保任何情况下都绝对只有一个实例和想在程序上表现出“只存在一个实例”. 下面通过一个实例来说明这种设计模式. package B ...

  5. unity 初始化数据存储问题

    在用unity进行开发的时初始化的数据和中间实时生成的数据存储不同,初始化文件数据建议安放在asset-StreamingAssets文件下,需要时读取取来.运行时所需的实时文件或数据持久化的xml文 ...

  6. django-模板之include标签(十五)

    就是将一些常用的html代码分离出来,使其可以重复利用,减少代码量 index.html <!DOCTYPE html> <html lang="en"> ...

  7. GO基础之List

    一.List定义 概述1.list是一种非连续存储的容器,由多个节点组成,节点通过一些变量记录彼此之间的关系.list有多种实现方法,如单向链表.双向链表等.2.Go语言中list的实现原理是双向链表 ...

  8. text文本样式二

    text-transform样式用于将元素的字母全都变成大小 letter-spacing设置字符之间的间距 <html> <head> <style type=&quo ...

  9. 纯HTML+JS实现轮播

    <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...

  10. 闯缸鱼:看懂python如何实现整数加和,再决定是否自学编程

    玩鱼缸的新手都知道有一种鱼叫"闯缸鱼",皮实好养,帮助新手判断鱼缸环境是否准备好.这篇笔记,最初用来解答一个编程新手的疑问,后来我发现,整理一下也可当做有兴趣自学python 编程 ...