HTML标签

1、<a></a> 超链接标签

属性

href:跳转页面的连接

name:实现定锚功能,跳转同一页面不同位置(例返回顶部)

target: (self, parent 以及 top 这三个值大多数时候与 iframe 一起使用。)

_blank浏览器总在一个新打开、未命名的窗口中载入目标文档。

_self 在本页面运行链接页面(默认)。

_parent这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如 果这个引用是在窗口或者在顶级框架中,那么它与目标 _self 等效

_top这个目标使得文档载入包含这个超链接的窗口,用 _top 目标将会清除所有被 包含的框架并将文档载入整个浏览器窗口。

mailto:发送邮件

2、<abbr></abbr>标签指示简称或缩写

属性

title:鼠标移到缩写内容上时,显示title信息

3、<address></address>元素中的文本通常呈现为斜体。

4、<article></article>文章标签

5、<aside></aside><aside> 的内容可用作文章的侧栏。

6、<audio></audio>插入音频

autoplay

autoplay

如果出现该属性,则音频在就绪后马上播放。

controls

controls

如果出现该属性,则向用户显示控件,比如播放按钮。

loop

loop

如果出现该属性,则每当音频结束时重新开始播放。

muted

muted

规定视频输出应该被静音。

preload

preload

如果出现该属性,则音频在页面加载时进行加载,并预备播放。

如果使用 "autoplay",则忽略该属性。

src

url

要播放的音频的 URL。

7、<b></b>标签规定粗体文本。

8、<bdo></bdo>改变文字输出方向。

属性

dir

  • ltr
  • rtl

文字从左向右输出

文字从右向左输出

9、<bgsound>>是IE浏览器中设置网页背景音乐的元素。不必使用

10、<br>换行

11、<button></button>按钮

属性

描述

autofocus

autofocus

规定当页面加载时按钮应当自动地获得焦点。

disabled

disabled

规定应该禁用该按钮。

form

form_name

规定按钮属于一个或多个表单。

formaction

url

覆盖 form 元素的 action 属性。

注释:该属性与 type="submit" 配合使用。

formenctype

见注释

覆盖 form 元素的 enctype 属性。

注释:该属性与 type="submit" 配合使用。

formmethod

  • get
  • post

覆盖 form 元素的 method 属性。

注释:该属性与 type="submit" 配合使用。

formnovalidate

formnovalidate

覆盖 form 元素的 novalidate 属性。

注释:该属性与 type="submit" 配合使用。

formtarget

  • _blank
  • _self
  • _parent
  • _top
  • framename

覆盖 form 元素的 target 属性。

注释:该属性与 type="submit" 配合使用。

name

button_name

规定按钮的名称。

type

  • button
  • reset
  • submit

规定按钮的类型。

value

text

规定按钮的初始值。可由脚本进行修改。

12、<canvas></canvas>

<canvas> 标签定义图形,比如图表和其他图像。

<canvas> 标签只是图形容器,您必须使用脚本来绘制图形。

13、<datalist></datalist>输入框的提示内容

14、<video></video>

CSS3操作

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{
margin: 0;
padding: 0;
list-style: none;
}
ul{
width: 520px;
height: auto;
margin: 100px auto;
}
li{
float: left;
height: 70px;
width: 70px;
border: 1px solid #000;
margin-left: -1px;
margin-top: -1px;
text-align: center;
line-height: 70px;
}
/* 选择li的第一个元素 */
li:first-child{
background-color: yellow;
}
/* 选择li的最后一个元素 */
li:last-child{
background-color: yellow;
}
/* 选择li的第11个元素 */
li:nth-child(11){
background-color: yellow;
}
/* 选择li的第奇数元素 */
li:nth-child(odd){
background-color: blue;
}
/* 选择li的第偶数元素 */
li:nth-child(even){
background-color: blue;
}
/* 选择li的前五个元素 */
li:nth-child(-n+5){
background-color: red;
}
/* 选择li的后五个元素 */
li:nth-last-child(-n+5){
background-color: red;
}
/* 选择li的7的倍数元素 */
li:nth-child(7n){
background-color: pink;
}
</style>
</head>
<body>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>10</li>
<li>11</li>
<li>12</li>
<li>13</li>
<li>14</li>
<li>15</li>
<li>16</li>
<li>17</li>
<li>18</li>
<li>19</li>
<li>20</li>
<li>21</li>
<li>22</li>
<li>23</li>
<li>24</li>
<li>25</li>
<li>26</li>
<li>27</li>
<li>28</li>
<li>29</li>
<li>30</li>
<li>31</li>
<li>32</li>
<li>33</li>
<li>34</li>
<li>35</li>
</ul>
</body>
</html>

HtML5与CSS3基础的更多相关文章

  1. 《HTML5与CSS3基础教程(第8版)》

    <HTML5与CSS3基础教程(第8版)> 基本信息 原书名:HTML and CSS:visual quickstart guide 作者: (美)Elizabeth Castro    ...

  2. HTML5与CSS3基础教程(第7版) 高清PDF扫描版​

    HTML5与CSS3基础教程(第7版)试读不仅介绍了文本.图像.链接.列表.表格.表单.多媒体等网页元素,也介绍了如何为网页设计结构.布局,添加动态效果.格式化等形式,此外还涉及调试和发布.聚合和吸引 ...

  3. HTML5与CSS3基础教程(第8版) PDF扫描版​

    <HTML5与CSS3基础教程(第8版)>自第1版至今,一直是讲解HTML和CSS入门知识的经典畅销书,全面系统地阐述HTML5和CSS3基础知识以及实际运用技术,通过大量实例深入浅出地分 ...

  4. 【02】HTML5与CSS3基础教程(第8版)(全)

    [02]HTML5与CSS3基础教程(第8版)(全)   共392页.   (魔芋:大体上扫了一遍.没有什么新东西,都是入门的一些基础知识.) 已看完.       [美]elizabeth cast ...

  5. HTML5与CSS3基础教程第八版学习笔记11~15章

    第十一章,用CSS进行布局 开始布局注意事项 1.内容与显示分离 2.布局方法:固定宽度和响应式布局 固定宽度,整个页面和每一栏都有基于像素的宽度 响应式布局也称为流式页面,使用百分数定义宽度 3.浏 ...

  6. HTML5和CSS3基础教程(第8版)-读书笔记(3)

    第11章 用CSS 进行布局 网站设计主要有两大类型:固定宽度和响应式. 对于固定(fixed)布局,整个页面和每一栏都有基于像素的宽度.顾名思义,无论是使用移动电话和平板电脑等较小的设备查看页面,还 ...

  7. HTML5和CSS3基础教程(第8版)-读书笔记(2)

    第7章 CSS构造模块 7.1 构造样式规则 样式表中包含了定义网页外观的规则.样式表中的每条规则都有两个主要部分:选 择 器(selector) 和 声 明 块(declaration block) ...

  8. 《HTML5与CSS3基础教程》笔记

    以下笔记摘要页码基于 人民邮电出版社 2013年1月第1版 英文书名:HMTL5 and CSS3 Visual Quickstart Guide (Seven Edition) 前言 P2: 渐进增 ...

  9. HTML5和CSS3基础教程(第8版)-读书笔记(4)

    第16章 表单 表单有两个基本组成部分:访问者在页面上可以看见并填写的控件.标签和按钮的集合:以及用于获取信息并将其转化为可以读取或计算的格式的处理脚本. 基本的表单字段类型包括文本框.单选按钮.复选 ...

  10. HTML5和CSS3基础教程(第8版)-读书笔记

    第1章 网页的构造块 一个网页主要包括以下三个部分: n        文本内容(text content):在页面上让访问者了解页面内容的纯文字. n        对其他文件的引用(referen ...

随机推荐

  1. mysql事务,视图,触发器,存储过程与备份

    .事务 通俗的说,事务指一组操作,要么都执行成功,要么都执行失败 思考: 我去银行给朋友汇款, 我卡上有1000元, 朋友卡上1000元, 我给朋友转账100元(无手续费), 如果,我的钱刚扣,而朋友 ...

  2. BZOJ1306 [CQOI2009]match循环赛/BZOJ3139 [Hnoi2013]比赛[dfs剪枝+细节题]

    地址 看数据范围很明显的搜索题,暴力dfs是枚举按顺序每一场比赛的胜败情况到底,合法就累计.$O(3^{n*(n-1)/2})$.n到10的时候比较大,考虑剪枝. 本人比较菜所以关键性的剪枝没想出来, ...

  3. fedora29 安装mongodb 4.0,6问题记录

    如果运行mongod命令时提示 无加载共享库libcrypto.so.10,那就到页面下载http://www.rpmfind.net/linux/rpm2html/search.php?query= ...

  4. mysql 8.0.18 mgr 搭建及其切换

    mysql 8.0.18 mgr 搭建及其切换 一.系统安装包 yum -y install make gcc-c++ cmake bison-devel ncurses-devel readline ...

  5. Java基础——集合框架(待整理)

    ArrayList 和 和 Vector 的区别 从代码的最终的操作形式上可以发现,代码的输出结果与之前是一样的,而且没有区别,但是两者的区别还在于其内部的组成上. No. 区别点 Vector Ve ...

  6. TOP K和Partition对比

    TOP k算法适用于海量数据,不用一批装入内存.. partition算法需要全部装入内存排序,需要修改原数据..

  7. PHP大文件上传断点续传源码

    文件夹数据库处理逻辑 publicclass DbFolder { JSONObject root; public DbFolder() { this.root = new JSONObject(); ...

  8. Fermat小定理的证明

    本证明参考了李煜东老师<算法竞赛进阶指南>. 我们首先证明欧拉定理,然后推导出费马小定理. 欧拉定理:若\(\gcd(a,n)=1,a,n\in \mathbb{Z}\),则\(a^{\p ...

  9. Selenium 文件下载

    点击文件下载时,弹出的那个框,webdriver是定位不到的,只有通过第三方工具或方法来操作 一.通过PyUserInput模拟键盘按键下载 PyUserInput是模拟鼠标和键盘的一个模块,替代了p ...

  10. xwiki使用中的问题

    xwiki 内存限制 问题重现: xwiki启动后内存.cpu一直上涨,不回落,启动后服务访问速度越来越慢,最后无法访问 分析: xwiki在启动时会消耗大量内存和cpu,增加tomcat最大内存限制 ...