HTML学习笔记——块级标签、行级标签、图片标签
1>块级标签、行级标签
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
p{
width: 200px;
height: 100px;
border: 3px solid red;
} p span{
color: red;
}
</style>
</head> <body> <p>今天是<span>星期一</span></p> <!-- 块级标签/能设置宽高度 -->
<p>我是p标签</p>
<p>我是p标签</p>
<p>我是p标签</p> <!-- 行级标签/能和其他标签待在一行 -->
<span>我是span标签</span>
<span>我是span标签</span> <a href="">百度</a>
<a href="">百度</a> </body>
</html>
2>图片标签
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#dog{
width:300;
height: 400px;
} #cat{
width:300;
height: 400px;
} p{
color: blue;
font-size: 30px;
font-family: 微软雅黑;
width: 800px;
height: 200px;
border: 3px solid blue;
text-align:center;
line-height: 200px;
}
</style>
</head> <body> <img src="dog.jpg" id="dog" />
<img src="cat.jpg" id="cat" /> <p>今天是星期一</p>
</body>
</html>
HTML学习笔记——块级标签、行级标签、图片标签的更多相关文章
- 学习总结:CSS(二)块级与行级元素特性、盒模型、层模型、BUG与BFC、浮动模型
一.元素的块级与行级特性 在CSS属性display控制元素是否及如何显示的特性,常用的值有none.inline.block.inline-block,在CSS3中还有一些新的特性状态,在这里不做讨 ...
- HTML块级、行级元素,特殊字符,嵌套规则
如果介绍HTML网页基本标签的嵌套规则,首先要说的就是元素的分类.元素可以划分为块级元素和行级元素,块级元素是什么?它可以独占一行,可以设置宽高度,默认是100%:行级元素与之相反,它的内容决定它的宽 ...
- ARMV8 datasheet学习笔记3:AArch64应用级体系结构
1.前言 本文主要从应用的角度介绍ARMV8的编程模型和存储模型 2. AArch64应用级编程模型 从应用的角度看到的ARM处理器元素: 可见的元素(寄存器/指令) 说明 可见的寄存器 R0-R30 ...
- python3.4学习笔记(五) IDLE显示行号问题,插件安装和其他开发工具介绍
python3.4学习笔记(五) IDLE显示行号问题,插件安装和其他开发工具介绍 IDLE默认不能显示行号,使用ALT+G 跳到对应行号,在右下角有显示光标所在行.列.pycharm免费社区版.Su ...
- amazeui学习笔记--css(HTML元素4)--图片image
amazeui学习笔记--css(HTML元素4)--图片image 一.总结 1.响应式图片:随着页面宽度而变化 .am-img-responsive class. <img src=&quo ...
- Flutter学习笔记(10)--容器组件、图片组件
如需转载,请注明出处:Flutter学习笔记(10)--容器组件.图片组件 上一篇Flutter学习笔记(9)--组件Widget我们说到了在Flutter中一个非常重要的理念"一切皆为组件 ...
- 基础学习笔记之opencv(6):实现将图片生成视频
基础学习笔记之opencv(6):实现将图片生成视频 在做实验的过程中.难免会读视频中的图片用来处理,相反将处理好的图片又整理输出为一个视频文件也是非经常常使用的. 以下就来讲讲基于opencv的C+ ...
- Flutter学习笔记(19)--加载本地图片
如需转载,请注明出处:Flutter学习笔记(19)--加载本地图片 上一篇博客正好用到了本地的图片,记录一下用法: 首先新建一个文件夹,这个文件夹要跟目录下 然后在pubspec.yaml里面声明出 ...
- HTML学习二_HTML常用的行级标签,常用实体字符及表单标签
HTML常用的行级标签(行内元素)不独占一行### 有语义的行内元素 #### HTML链接 a标签 ```angular2html<a href="链接地址">链接文 ...
随机推荐
- Oracle空串与null的处理
来源于:http://blog.itpub.net/24870090/viewspace-1057853/ Oracle空串与null的处理[@more@] Oracle中的空字符串基本上是被当成空N ...
- androd Sdk manager配置
Android Android SDK 配置步骤 启动 Android SDK Manager ,打开主界面,依次选择「Tools」.「Options...」,弹出『Android SDK Manag ...
- Retrofit2 + OkHttp3设置Http请求头(Headers)方法汇总
在构建网络层时会遇到一个问题就是要手动配置Http请求的Headers,写入缓存Cookie,自定义的User-Agent等参数,但是对于有几十个接口的网络层,我才不想用注解配置Headers,目前网 ...
- Java 构建器
假如我们的一个实体类有很多的属性值,但是这些属性值又是可选的.如果我们遇到这样的是类,如何设计出方便的实体类呢? 通常解决办法一: 重叠构造器 public class User { private ...
- Fiddler捕获 iPhone/Android 流量
由于 Fiddler 作为代理的形式来捕获流量,因此理论上来说是不区分客户端的(当然 Fiddler 要安装在 Windows,毕竟是 .NET 开发的工具). 这一篇文章教你如何利用 Fiddler ...
- poj3254 状态压缩dp
题意:给出一个n行m列的草地,1表示肥沃,0表示贫瘠,现在要把一些牛放在肥沃的草地上,但是要求所有牛不能相邻,问你有多少种放法. 分析:假如我们知道第 i-1 行的所有的可以放的情况,那么对于 ...
- mssql-异常value '0000-00-00' can not be represented as java.sql.Date
Mysql开发中采用ResultSet取值時,不管是才用getString()还是用getDate(),或者getObject,均会拋出如题所述异常.查阅Mysql官方Bug咨询: 是因为日期型(Da ...
- 绑定: x:Bind 绑定, x:Bind 绑定之 x:Phase, 使用绑定过程中的一些技巧
背水一战 Windows 10 之 绑定 x:Bind 绑定 x:Bind 绑定之 x:Phase 使用绑定过程中的一些技巧 示例1.演示 x:Bind 绑定的相关知识点Bind/BindDemo.x ...
- ajax跨域原理以及解决方案
说明 跨域主要是由于浏览器的“同源策略”引起,分为多种类型,本文主要探讨Ajax请求跨域问题 前言 强烈推荐阅读参考来源中的文章,能够快速帮助了解跨域的原理 参考来源 本文参考了以下来源 浏览器同源政 ...
- C# 公历转农历
/// <summary> /// LunDay 的摘要说明. /// 用法说明 /// 直接调用即可,比较简单 /// </summary> ...