html入门第二天。
二·
1.图片与多媒体:
--------------
img标签(重中之重):
网页中的图片展示就是用的img标签实现,img元素相网页中嵌入一幅图形,行内标签,单标签。
基础语句:<img src ==“图片路径”alt=“图片说明文字”/>
能够识别多种图片格式,如:png,gif,jpg。
当修改图片的高度时,图片宽度会等比例缩放(反之亦然)。
audio标签(定义音频):
基本语法:<audio src="音乐文件路径" autoplay=“autoplay”>提示文字</audio>
src属性:音乐文件路径URL,必写。
autoplay属性:自动播放。
controls属性:音乐控件。
loop属性:循环播放。
mute属性:静音。
preload:出翔该属性这音频在页面加载时进行加载,并预备播放,如果已用autoplay,这忽略此属性。
支持格式:Ogg Vorbis,MP3, wav。
video标记(定义视频):
基本语法:<video src=“视频文件路径”controls=“controls”>提示文字</video>
src属性:视频文件路径URL,必写。
autoplay属性:自动播放。
controls属性:播放控件。
height:视频播放器高度。
width:设置视频高度。
poster:规定视频下载时显示图像,或者用户点击播放按钮前显示图像。
loop属性:循环播放。
mute属性:静音。
preload:出翔该属性这视频在页面加载时进行加载,并预备播放,如果已用autoplay,这忽略此属性。
支持格式:ogg, MPEG4, WEBM。
source 标签:
source标签为媒介元素(比如<video> <audio>)定义媒介资源
基本语法:<source src="资源地址URL" type=“资源类型”>
常用的类型:
用于视频:
video/ogg
video/mp4
video/webm
用于音频:
audio/ogg
audio/mpeg
2.列表标签:ul, ol,dl:
列表标签是网页标签开发中常用的一种标签,一般用于某项数据得列表或导航,比如说:新闻列表,产品列表,图片列表。
-无序列表ul。
-有序列表ol。
-定义列表dl。
无序列表ul:常用于表示内容之间存在并列关系,每个列表分为多个子项,但是子项之间没有相应的编号,只有一个原点用于标识。
基本语法:<ul>
<li>文本内容</li>
</ul>
ul标签效果:li标签前面自动生成小圆点,一般情况会结合css去掉小圆点。
ul标签:定义列表的一个区域。
li标签:定义列表的每一个子项,可有多个子项
注意:1.ul标签是块元素;2.ul标签只能放li标签;3.li标签里面可以嵌套任何标签
有序标签ol:每个列表都分为多个子项目,没个子项都有相应的编号。
基本语法:
<ol>
<li>文字</li>
</ol>
注意:1.ol标签与li标签配合使用。2.ol可以嵌套使用。
type属性:1.A代表列表前面显示的大写字母;
2.a表示列表前面显示小写字母;
3.I代表大写罗马字母;
4.i代表小写的罗马字母;
5.默认显示数字;
dl定义列表:常用于表示名词或者概念的定义,每个子项有两个部分组成,第一部分是名词或概念,第二部分是解释和描述。
基本语法:
<dl>
<dt>名词或概念</dt>
<dd>名词或概念的解释说明</dd>
</dl>
注意:dl标签里面必须和dt和dd配合使用,一般配合css一起完成显示效果。
总结:这一节学的内容相对之前的文字,趣味性高了很多,学习起来兴趣更大,上手也很容易。也初步了解了表格相关知识,还有很多意思的内容等着学。
html入门第二天。的更多相关文章
- JAVA入门第二季(mooc-笔记)
相关信息 /** * @subject <学习与创业>作业1 * @author 信管1142班 201411671210 赖俊杰 * @className <JAVA入门第二季&g ...
- ElasticSearch入门 第二篇:集群配置
这是ElasticSearch 2.4 版本系列的第二篇: ElasticSearch入门 第一篇:Windows下安装ElasticSearch ElasticSearch入门 第二篇:集群配置 E ...
- Docker 入门 第二部分: 容器
目录 Docker 入门 第二部分: 容器 先决条件 介绍 你的新开发环境 使用 Dockerfile 定义一个容器 Dockerfile 应用本身 requirements.txt app.py 构 ...
- Hibernate入门第二课 Hibernate Tools for Eclipse Plugins安装
Hibernate入门第二课 Hibernate Tools for Eclipse Plugins安装 你们可以直接去,http://blog.csdn.net/wei_chong_chong/ar ...
- Java入门第二季学习总结
课程总概 该门课程作为java入门学习的第二季,是在有一定的java基础上进行的进一步学习.由于该季涉及到了java的一些核心内容,所以相对第一季来说,课程难度有所提升.大致可将该季的课程分为五部分: ...
- 解析Mybatis入门第二天
入门第二天 目的:使用Mybatis对数据库中的数据进行简单的操作.例如:增.删.改.查. 前言:同样是使用idea创建一个普通的maven工程(如何创建一个普通的Maven工程可以参考入门第一天的详 ...
- 数据结构入门第二课(浙大mooc)
数据结构入门第二课 目录 数据结构入门第二课 引子 多项式的表示 方法1 顺序结构表示多项式各项 方法2 顺序结构表示非零项 方法3 链表结构存储非零项 多项式问题的启示 线性表 线性表的抽象数据类型 ...
- COM编程入门第二部分——深入COM服务器
本文为刚刚接触COM的程序员提供编程指南,解释COM服务器内幕以及如何用C++编写自己的接口.继上一篇COM编程入门之后,本文将讨论有关 COM服务器的内容,解释编写自己的COM接口和COM服务器所需 ...
- Kotlin入门第二课:集合操作
测试项目Github地址: KotlinForJava 前文传送: Kotlin入门第一课:从对比Java开始 初次尝试用Kotlin实现Android项目 1. 介绍 作为Kotlin入门的第二课, ...
- SpringMVC入门第二天
SpringMVC第二天 1. 回顾 1.Springmvc介绍? Springmvc是Spring公司 2.Springmvc入门程序 第一步:Web工程 第二步:导Jar包 第三步:web.x ...
随机推荐
- ISE_pll_ip的建立
创建clk的ip核以及设置PLL的时钟输出 原理:外部晶振输入50M的频率,由ip核输出想要的频率 1.新建工程model再在"芯片"名称上建立clk的ip核 2.设置输入写为50 ...
- JIRA的邮件通知
提交测试或提交上线申请时发送给相关的开发人员.测试人员.运维人员. 使用插件Notification
- 20175311 《Java程序设计》第三周学习总结
20175311 2018-2019-2 <Java程序设计>第3周学习总结 教材学习内容总结 在蓝墨云中的教程里学习了如何安装IDEA,并且尝试了自己破解IDEA 主要在看书时,对jav ...
- LINUX FTPshez
https://www.jb51.net/article/132337.htm FTPQ重启: service vsftpd restart
- 接口与继承:方法覆盖(super)
源代码 //父类Parent class Parent{ int x; int y; Parent() { x = ; y = ; } public void Set(int a,int b) { x ...
- django rest framework serializer中获取request中user方法
views.py serializer = self.get_serializer(data=request.data, context={'request': request}) seriali ...
- 20165205 《网络对抗技术》 Exp0 Kali安装
20165205 <网络对抗技术> Exp0 Kali安装 一.下载及安装 打开官方下载网站 我下载的是vm版,64位,如下图 之后继续点击 之后就可以等待下载成功了,成功之后找到.vmx ...
- abp.net zero 运行报500.21,错误模块AspNetCoreModuleV2
关于这个运行时提示的问题,导致项目无法运行,之前我是遇到过的,也是查了很久最后解决了 但忘记记录了...岁数大了脑袋不好用了...这次依然找了各种方案,有很多都说由于net core 不是最新的,但我 ...
- Tomcat版本对照表
导入程序前环境要先配好,环境要想配的正确,版本信息一定要了解. Tomcat版本 6.0 7.0 8.0 8.5 9.0 JDK ≥5.0 ≥6.0 ≥7.0 ≥7.0 ...
- python 获取中文拼音首字母;判断文件夹是否存在
1.如何获取中文字符串的首字母 import pinyin #输入name def get_pinyin_first_alpha(name): return "".join([i[ ...