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="链接地址">链接文 ...
随机推荐
- 1011MySQL Query Cache学习笔记
转自:http://blog.chinaunix.net/uid-16844903-id-321156.html 测试环境 MySQL 5.5 innodb_version 1.1.6 MySQL Q ...
- SpringMVC使用@PathVariable，@RequestBody，@ResponseBody，@RequestParam，@InitBinder
@Pathvariable public ResponseEntity<String> ordersBack( @PathVariable String reqKey, ...
- ThinkPHP上传返回 “文件上传保存错误！”
这个问题,最终的由于 Local.class.php中的iconv('utf-8', 'gb2312' ,$filename)的问题 因为我上传的文件名中有 "-" 这个符号. i ...
- 控件（选择类）: Selector, ComboBox
1.Selector(基类) 的示例Controls/SelectionControl/SelectorDemo.xaml <Page x:Class="Windows10.Contr ...
- 【POJ 2187】Beauty Contest（凸包直径、旋转卡壳）
给定点集的最远两点的距离. 先用graham求凸包.旋(xuán)转(zhuàn)卡(qiǎ)壳(ké)求凸包直径. ps:旋转卡壳算法的典型运用 http://blog.csdn.net/hanch ...
- java,js,jstl,EL的简单交互
EL全名Expression Language.EL提供了在JSP脚本编制元素范围外使用运行时表达式的功能. 脚本编制元素是指页面中能够用于在JSP文件中嵌入java代码的元素. JSP标准标记库(j ...
- 【poj2478】 Farey Sequence
http://poj.org/problem?id=2478 (题目链接) 题意 求分母小于等于n的真分数的个数. Solution 现在只能做做水题了,唉,思维僵化. 细节 前缀和开LL 代码 // ...
- UOJ34 多项式乘法
本文版权归ljh2000和博客园共有,欢迎转载,但须保留此声明,并给出原文链接,谢谢合作. 本文作者:ljh2000作者博客:http://www.cnblogs.com/ljh2000-jump/转 ...
- phpize报cannot find autoconf
突然想往php种增加个模块,可是又不想重新编译php,因为真的比较费时间. phpize就可以解决这个问题. 遇到的问题: Configuring for: PHP Api Version: Zend ...
- PHP Lex Engine Sourcecode Analysis(undone)
catalog . PHP词法解析引擎Lex简介 . PHP标签解析 1. PHP词法解析引擎Lex简介 Relevant Link: 2. PHP标签解析 \php-5.4.41\Zend\zend ...