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="链接地址">链接文 ...
随机推荐
- 使用D3绘制图表（5）--水平柱状图表
绘制水平柱状图表的方法也不是很难,首先在svg中插入g,然后在g中插入rect. 1.html代码 <!DOCTYPE html> <html> <head> &l ...
- iOS开发小技巧--自定义带有占位文字的TextView(两种方式)
自定义控件注意或框架注意:自己暴露在外面的属性,一定要重写setter,保证外界与内部的交互性 一.方案一:通过drawRect:方法将文字画到textView中,监听文字改变用的是通知中心(代理也可 ...
- 初探psutil
系统性能信息模块psutil 1,psutil简介 psutil是一个跨平台能够轻松获取系统的进程和系统利用率,主要应用在系统监控,分析和限制系统资源以及进程管理.它实现了很多系统管理的命令,如ps, ...
- CSS截取截取字符长度并显示省略号的方法
HTML部分 <div> <span>这是一个CSS3截取截取字符的例子.它根据宽度来处理.</span> </div> <div class=& ...
- office-excel函数
函数 当前日期 NOW() 取整(商)取余 =)/)&),) 函数计算 上一个月份 =,DAY(TODAY())) 判断两个单元格的内容是否相等 =,) 常用函数有:left函数,right函 ...
- epon e8-c HG220GS超级密码破解
网上找了很多管理电信e8-c的破解资料,大多都是明文密码,而hg220gs则为加密的密码,找来找去最后终于找到加密方式了base64,真心不容易 下面从其他博文中转载过来留着记录 低端hack.主要是 ...
- git初体验（五）SSH的理解
一.SSH SSH是Secure shell的缩写,即"安全外壳协议",专为远程登录会话和其他网络服务提供安全性的协议,是一项计算机上的安全协议. 传统的网络服务程序,如rsh.F ...
- JS 弹窗到右下角
<div id="msg_win" style="display: block; top: 490px; visibility: visible; opacity: ...
- 【HDU 5835】Danganronpa（分配礼物）
10种礼物,每种有ai个,每个小朋友分两个礼物,其中普通礼物要求相邻两人的不能一样,求最多分给几个小朋友. sum/2是最多的情况.什么时候发不了那么多,就是当max很大,无论怎么发,都发不完max. ...
- Torch7的安装
Torch7 是一个科学计算框架,支持机器学习算法.易用而且提供高效的算法实现,得益于 LuaJIT 和一个底层的 C 实现. 提供: 一个强大的 N 维数组 提供大量索引.切片和置换的程序 通过 L ...