没有一张图解决不了的事:https://www.processon.com/mindmap/5ccebc48e4b0841b844a23fb

1.网页中web 标准的三层组成?

W3C 万维网联盟

结构(HTML)、表现(CSS)、行为(JAVASCRIPT)

标签分类:

双标签

单标签

标签关系:

嵌套关系

并列关系

<html lang = 'zh-CN'>   语言种类

<mate charset = ''UTF-8>  字符集.万国码(各个国家都能显示页面的语言)

HTML 标签语义化

让结构跟清晰

排版标签

<h> 标题标签

<p> 段落标签

<hr/> 水平线标签

<br/> 换行

没有语义

<div></div>  一行只能放一个。。。

span            一行能放多个

文本格式化标签

i    斜体

strong  加粗

b       加粗

s          删除线

del      删除线

u     下划线

ins    下划线

标签属性

img

alt (不能显示图片时替换文本)

title   鼠标停留

width 宽度

height  高度

borde  边框( 在图片边 加上一个框)

a

内部链接

外部链接   加http

href    跳转目标  # (代表一个空)

target   self     _blank

a标签可以套img

路径

相对路径

../上一级目录

锚点定位

当点击某一个点,立即跳转到具体网页位置

<h3 id="two">第二集</h3>     具体定位的文本

<a href = "#two"> 链接文本 </a>     点击文本

<base target = "_blank">  设置所有的a标签属性都在新窗口打开

特殊字符

&nbsp

<div>&ls &ls<div>  小于号以后这样写

表格

显示,展示数据。才使用

<table>

  <thead><thead>

  <tbody><tbody>

</table>

<table>

  <caption><h3>表头</h3></caption>

  <tr>

    <th></th>

  </tr>
  <tr>

    <td></td>

  </tr>

</table>

表格的结构划分

<thead><thead>    用来定义表格头部 用来放标签之类的

<tbody><tbody>    用来定义表格主体

<tfoot></tfoot>     放表格脚注

表格属性

th表头单元格会加粗显示 

border = '1'   边框

width     宽

height   高

align    水平对齐方式   left   right   center.  不是表格中的数据 而是文档流中

cellspacing     单元格与单元格之间的距离

cellpadding     子和边框的距离

合并单元格

跨行合并

-

-

-
<td rowspan = '2'>照片</td> 

多余的单元格删除掉 

跨列合并

---------------

<td colspan = '3'>照片</td> 

多余的单元格删除掉 

列表标签

自由组合度更高

有序列表

<ol>

  <li></li>

</ol>

无序列表

<ul>

  <li></li>

</ul>

自定义列表

<dl>

  <dt>湖南</dt>

  <dd>长沙</dd>

  <dd>株洲</dd>

</dl>

表单

redio

checked=’checked‘ 默认选中

chekbox

checked=’checked‘ 默认选中

button

img 图片提交按钮

<input type = 'image' src = '#'><input/>

lable

<lable for='id'></lable>

获得输入光标焦点

不用双引号

HTML手稿的更多相关文章

  1. Git学习原版手稿

    手稿诞生记        Git学习的时候难免会有遗忘然后往复学习查看的过程,所以就形成了这个学习的手稿,记录了Git使用过程中的大部分命令,今天在清理的时候偶然看到了这些记录,而且最近也在写Git的 ...

  2. 几幅手稿讲解CNN

    学习深度神经网络方面的算法已经有一段时间了,对目前比较经典的模型也有了一些了解.这种曾经一度低迷的方法现在已经吸引了很多领域的目光,在几年前仅仅存在于研究者想象中的应用,近几年也相继被深度学习方法实现 ...

  3. React 手稿 - Component state

    Component state 实例: import React, { PureComponent } from 'react'; export default class extends PureC ...

  4. React手稿之 React-Saga

    Redux-Saga redux-saga 是一个用于管理应用程序副作用(例如异步获取数据,访问浏览器缓存等)的javascript库,它的目标是让副作用管理更容易,执行更高效,测试更简单,处理故障更 ...

  5. React手稿 - Context

    Context Context提供了除props之外的传参数的方式. Context是全局跨组件传递数据的. API React.createContext ``` const {Provider, ...

  6. React手稿之State Hooks of Hooks

    React Hooks React在16.7.0-alpha.0版本中提到了Hooks的概念,目前还是Proposal阶段. 官方也陈述,接下来的90%的工作会投入到React Hooks中. 从目前 ...

  7. iOS开发之功能模块--计算高度Demo探究手稿

    本篇记录关于计算文本高度和Label高度的代码,以备后期再探究: 首先是YouXianMing老师的工具类别: NSString+LabelWidthAndHeight.h // // NSStrin ...

  8. c#多线程生产者消费者(手稿)

    屋舍简陋,隔壁的娃娃哭了一晚,心中无恶意纯中性的想,有病就赶紧带孩子去看医生吧,能哭这么久估计孩子真的不舒服.

  9. 链接服务器"(null)"的 OLE DB 访问接口 "Microsoft.Jet.OLEDB.4.0" 返回了消息 "未指定的错误"。[手稿]

    消息 7302,级别 16,状态 1,第 1 行 无法创建链接服务器 "(null)" 的 OLE DB 访问接口 "Microsoft.JET.OLEDB.4.0&qu ...

  10. SQL Server 最小化日志操作解析,应用[手稿]

    Sql Server 中数据库在BULK_LOGGED/SIMPLE模式下的一些操作会采用最小化日志的记录方式,以减小tran log落盘日志量从而提高整体性能. 这里我简单介绍下哪些操作在什么样的情 ...

随机推荐

  1. 网络安全—部署CA证书服务器

    文章目录 网络拓扑 安装步骤 安装证书系统 安装从属证书服务器 申请与颁发 申请证书 CA颁发证书 使用windows Server 2003环境 网络拓扑 两台服务器在同一网段即可,即能够互相pin ...

  2. Gitee千Star优质项目解析: ng-form-element低开引擎解析

    好家伙, 在写项目的时候,我发现自己的平台的组件写的实在是太难看了,于是想去gitee上偷点东西,于是我们本期的受害者出现了 gitee项目地址 https://gitee.com/jjxliu306 ...

  3. 有隙可乘 - Android 序列化漏洞分析实战

    作者:vivo 互联网大前端团队 - Ma Lian 本文主要描述了FileProvider,startAnyWhere实现,Parcel不对称漏洞以及这三者结合产生的漏洞利用实战,另外阐述了漏洞利用 ...

  4. fuser命令详解

    fuser -mv 作用 fuser命令是用来显示所有正在使用着指定的file.file system或者sockets的进程信息.具体来说,fuser -mv的作用如下: 参数-m:指定一个被加载的 ...

  5. 2024 CISCN WEB 部分wp

    前言 第二天的revenge真是绷不住,出的很好,下次多出点revenge. ezjava 简要介绍 sqlite jdbc...真的没想到,写文件覆盖写了半天,结果是个CVE...,给的很多东西都是 ...

  6. HTML——文本域

    在 HTML 中,使用 <textarea> 标签来表示多行文本框,又叫做文本域.与其它 <input> 标签不同,<textarea> 标签是单闭合标签,它包含起 ...

  7. 循环demo

      // demo1,输出1-100所有可以同时被2和3同时整除的数值         //方法1         // 循环生成 1-100的数值         // for(var i = 1  ...

  8. ES5的继承语法

    <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8 ...

  9. redisTemplate缓存方法template code

    import com.alibaba.fastjson.JSONObject; @Autowired private RedisTemplate redisTemplate; String PREFI ...

  10. 随机二次元图片API第三弹

    Tips:当你看到这个提示的时候,说明当前的文章是由原emlog博客系统搬迁至此的,文章发布时间已过于久远,编排和内容不一定完整,还请谅解` 随机二次元图片API第三弹 日期:2020-3-10 阿珏 ...