HTML/CSS 学习笔记(一)
来源:互联网 发布:尼古丁 贴片 危害 知乎 编辑:程序博客网 时间:2024/06/14 10:27
html的头标签的使用
* html两部分组成 head和body
** 在head里面的标签是头标
** title标签:表示在标签上显示的内容
** <meta>标签:设置页面的一些相关内容
- <meta name=”keywords” content=”“>
- <meta http-equiv=”refresh” content=”3;url=”>
refresh,表示页面刷新,content后面的3代表3秒后刷新,分好后的url代表转到的网页地址
** base标签:设置超链接的基本设置
-可以统一设置超链接的打开方式
<base target=”_blank”/>
** link标签:引入外部文件
** CSS可以使用link标签引入css文件框架标签的使用
* <frameset>
- rows按照行进行划分
** <frameset rows=”80, *”> rows有两个值,80代表第一行是80,*代表剩下的页面都是第二行
- cols:按照列进行划分
** <frameset cols=”80, *”>
* <frame>
- 具体显示的页面
- <frame name=”lower_left” src=”b.html”>
* 使用框架标签的时候,不能写在body里面,使用了框架标签,需要把body去掉,这样就违背了一些规范,所以框架标签很少使用
<html> <head> <title>框架标签</title> </head> <frameset rows='80,*'> <frame name='top' src='a.html'> <frame name='bottom' src='b.html'> </frameset></html>
这是a.html
这是b.html
效果
上下分完以后,再将下面的部分分开。就是用嵌套结构,把下面的部分写成<frameset><frame name=”” src=”“></frame></frameset>这里的name要定义好,超链接时候可以指定页面打开的位置
<html> <head> <title>框架标签</title> </head> <frameset rows='80,*'> <frame name='top' src='a.html'/> <frameset cols='200,*'> <frame name='bottom_left' src='b.html'/> <frame name='bottom_right' src='c.html'/> </frameset> </frameset></html>
当分别点击超链接1,超链接2,超链接3的时候,右下角的框就会出现相应的页面
内容总结
- html操作思想(* * * * )
* 使用标签把要操作的数据包起来,通过修改标签的属性值,来实现标签内数据样式的变化 - font标签 属性:size 取值范围 1-7 color:英文单词,十六进制数
- 标题标签<h1></h1>…<h6></h6>:h1到h6越来越小,自动换行
- 注释<!- -html的注释- ->
- 列表标签
* * <dl><dt></dt> <dd></dd></dl>
* * 有序 <ol><li></li></ol>
* * 无序 <ul><li></li></ul> - 图像标签(* ** *)
<img src=”图片的路径” width=”” height=”” alt=”“>
* *alt的浏览器兼容性差,不建议使用 - 路径(相对路径)(**)
**在同一级目录:直接写
**在下一级目录: images/1.jpg
**在上层目录:../ - 超链接标签
<a href=”路径”>显示在页面上的内容</a>
* * 打开方式 target=“_self _blank ”默认是当前页面打开 - 表格标签
<table>
<tr>
<td></td>单元格
</tr>
</table>
<th>:加粗和居中
-技巧:先数有多少行,数每行里面有多少个单元格 - 表单标签
* <form></form>
属性:action:提交到的地址 method:提交方式:常用的有两种 get和post,注意两者的区别
* 输入项里面写name(必须写,否则表单提交不上去)
* 普通输入项:<input type=”text”/>
* 密码输入项:<input type=”password”/>
* 单选框:<input type=”radio”/>name属性要相同,同时记得还有一个value值用于区分提交表单中的选择项(不写value时候区分不了选的是什么)
* 复选框:<input type=”checkbox”/>
* 下拉框:<select name=”“><option value=”“></option></select>
* 文本域:<textarea cols=”“rows=”” name=”“></textarea>
* 文重置:<input type=”reset”/>
* 使用图片提交:<input type=”image” src=”图片的路径”/>
* 隐藏项:<input type=”hidden”/>
* 普通按钮:<input type=”button”/> - div和span
div自动换行,span一行表示 - 框架标签
会使用即可
以上是html常用的东西,其他可以查文档。本人是菜鸟一枚,当做学习笔记写博客。谢谢各路大咖驻足审阅
- HTML、CSS学习笔记(一)
- html,css学习笔记(一)
- HTML和CSS学习笔记(一)
- HTML+CSS学习笔记(一)
- HTML+CSS学习笔记(一)
- HTML/CSS 学习笔记(一)
- FreeCodeCamp 学习笔记(一)HTML&CSS
- HTML+CSS学习笔记一
- 学习笔记(一) HTML+CSS基础课程
- HTML+CSS学习笔记(一)——网页布局
- HTML学习笔记之CSS属性设置(一)
- head first html与css学习笔记(一)
- 《HTML+CSS基础课程》学习笔记一
- 一、HTML+CSS基础知识学习笔记
- Html /css 笔记<一>
- HTML&CSS学习一
- Head First Html+CSS 笔记(一)
- HTML/CSS学习笔记
- python代码结构(第四章)
- linux学习—oracle导入数据库报唯一约束错误
- Android中获取SD卡下的图片资源
- iOS-企业级开发者账号发布流程
- 关于错误:The type Date is ambiguous 可能的原因之一
- HTML/CSS 学习笔记(一)
- 内核驱动上报EV_LED事件失败原因分析
- 使用structs2的时候进入action 不能赋值的错误
- 版本控制入门
- java wait()和sleep()的区别
- 对象权限+授予对象权限
- git 上传项目时提示Permission denied (publickey).的解决
- 微信小程序开发:各种页面特效集合(持续更新)
- JAVA设计模式初探之装饰者模式