初入web知识点(一)

HTML标签:
◆ <img src="../images/XXX.PNG" alt="xxx">
../表示url地址信息 最好不要超过两级 images表示上两级中的images文件夹 XXX.PNG表示images文件夹中的某一张PNG图片 xxx表示当图片不显示时所显示的文本内容“xxx”
◆ <pre></pre>
预文本格式 网页显示内容样式与代码编写时的样式一样
◆ <a href="……"></a> a 标签
……链接地址URL
◆ 锚点(回到顶部 跳转到相对应的地方)
①创建锚点 <a href="" name="zhuang"></a>
②指向锚点<a href="#zhuang">回到指定点</a> #只表示分隔符
◆ <div></div>盒模型
<div style="border:1px solid red ; height:50px">一段文字</div>
一段文字 的周围有一个 border 边框 1px 红色 高度为50px
◆ 列表
①无序列表<ul><li></li></ul> 列表前面有小点
②有序列表<ol><li></li></ol> 列表前面是序号
③定义列表<dl><<dt><dd></dd></dt></dl>
Tips:li*5→Tab 可快速生成5个<li></li>
◆ <iframe src="" frameborder="0"></iframe>框架
内联框架 就是框架标签与a标签一起实现的 分为框架命名和a标签
Tips:程序中的符号都是英文状态下的符号,若是在中文状态下输入的符号则识别不了。比如分号
◆ <table></table>表格
表格是由行<tr></tr>和单元格<td></td>组成的
<caption></caption>表示标题 <th></th>表头(有加粗效果)
合并:→ 行合并<td rowspan="2"></td>
→ 列合并<td colspan="2"></td>
align针对的是整个表格 可调节表格的左、中、右
<table border="1" align="left/center/right" style="border-collapse: collapse" ></table>
border="1" 边框显示 align="left/center/right" 表格居左/中/右 style="border-collapse: collapse"是插入的CSS 表示表格双线框变为单线框
<table border="1" align="center" cellpadding="15" cellspacing="25"></table>
cellpadding="15"表示表格内边距为15 cellspacing="25"表示表格外边距为25

表单(form)提交数据 用于交互
<form action="(表单处理程序的地址)" method="(提交方式)">……</form>
◆form提交方式只有两种:
①get: 会在地址栏显示用户信息 安全低 速度快
②post:不会在地址栏显示用户信息 安全高 速度慢
◆input type类型 代码
①html: text文本 password密码 button按钮 submit带提交功能的按钮 reset重置 radio单选 checkbox多选 image图片 hidden隐藏 color颜色
②html5: file文件 date日期 datetime时间 email邮件 number数字 search搜索 URL地址
◆按钮类型
①input type=submit 自带提交功能
②input type=button value=""
③标签button
◆表单属性名
autocomplete 自动完成
autofocus 自动聚焦
readonly 只读
disabled 输入、控制不可用
readonly与disabled唯一区别是后者有灰色底纹
◆textarea文本域
<textarea name="" id="" cols="" rows=""><textarea>
命名区别:
name 名称可相同 与后台交互用
id 名称唯一、不同 JS部分
class 名称类别可相同 html、css前台页面部分
◆下拉菜单
<select name="" id="">
<option value="">……</option> 选项
</select>
◆label 与input合用 扩大、包裹
<input type="radio" id="man" name="sex"><label for="man">男</label>
页面显示选择是 点击“男”也可以进行选择

时间: 2024-10-25 15:56:22

初入web知识点(一)的相关文章

初入web知识点(二)

◆CSS选择器(七种) ①元素选择器(类型选择器) 选择匹配选择器的网页上的任何HTML元素,不考虑这些元素在文档树中的位置.目标是一个元素的每个实例. ②类选择器(类名{属性:值:}) 被用于选择有某个class属性的任何HTML元素,不考虑在文档树中的位置. ③ID选择器 与类选择器相似,被用于选择某个ID属性的任何HTML元素,不用考虑这些元素在文档树中的位置.与类选择器的主要区别在于,同一属性ID值在同一页面上只能出现一次.而同一class属性值可以在同一页面中多次出现. ④包含选择器

初入web知识点(八)

◆APP端/**CSS原生代码**/TIP:① 还是要在head部分加入 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">网页自适应移动端② 宽高使用百分比③ 高也可以使用rem④ CSS文件开头要用@media比如:@media screen and (min-width: 960px){

初入web知识点(七)

◆LESS 基于CSS的一种扩展技术:引入了变量.混合.运算.函数:简化CSS的代码,降低维护成本:必须通过解析器(koloa).***步骤***①新建文件夹②.html文件 .less文件③启动koloa配置路径④输入less文件 刷新koloa⑤会自动生成一个.css的文件(在写的过程中不要关闭koloa软件)⑥html引入的文件是koloa解析出来的CSS文件 ◆**◆ ①变量:@变量名:值 如 @名称自取: 5px soild red; 使用时 div{ border:@名称自取 } ②

初入web知识点(四)

◆CSS选择器(补充) ①伪类选择器 格式: 元素:属性{} 允许我们格式化不在文档树中的一些条目.向某些元素添加特殊样式 锚伪类 不同方式格式化超级链接<a>元素的四种不同状态; * a:link 是用在未访问过的链接的选择器 * a:visited 是用在以访问过的链接的选择器 * a:hover 是用在鼠标光标放在其上的链接选择器 * a:active 是用在获得焦点(比如被点击)的链接上的选择器 TIP:在CSS定义中,a:hover必须置于a:link和a:visited之后才有效:

初入web知识点(三)

◆HTML5标签 video视频(主要格式MOEG4) audio音频(主要格式MP3) <video src="地址"></video> <audio src="地址"></audio> *标签属性(主要) ①autoplay 自动播放 ②controls 显示控件 ③loop 循环播放◆块级元素和行内元素 块级元素 行内元素 独占一行 不独占一行 可设宽高 不可设宽高 内容大小影响不影响元素大小 内容大小不影响不影

初入web知识点(六)

◆过渡 transition 苹果浏览器前要加前缀 IE9不支持 多与hover配合使用 可以在不使用 Flash 动画或 JavaScript 的情况下,当元素从一种样式变换为另一种样式时为元素添加效果. 要实现这一点,必须规定两项内容: ①规定您希望把效果添加到哪个 CSS 属性上 规定属性名称 ②规定效果的时长 ,以秒为单位 默认值是0 属性: transition 简写属性,用于在一个属性中设置四个过渡属性 transition-property 规定应用过渡的 CSS 属性的名称 tr

初入web知识点(五)

◆CSS盒模型 包含:element元素 padding内边距 border边框 margin外边距 * 内边距padding padding是简写属性 设置值时不能为负值 值的顺序是top上→right右→bottom下→left左 设置时如不全部定义则 top的值影响right和bottom right的值影响left * 边框border 属性:style width color(默认值为透明色transparent,可以利用这一点来做三角形) border足够粗 div足够小 并且其他三

初入javascript知识点(八)

jQuery性能优化 1.对于在jQuery中重复使用的标签,在第一次选择的时候就用一个变量把它保存起来. 2.在使用类名选择器时,加上父级选择器(父级选择器使用id或标签名) 3.使用find方法来选取后代 4.尽量使用jquery中的链式写法 5.使用事件委托 数据库 数据库(Database)是按照数据结构来组织.存储和管理数据的仓库. MongoDB简介 MongoDB是一个基于分布式文件存储的数据库,由C++语言编写,旨在为WEB应用提供可扩展的高性能数据存储解决方案. MongoDB

初入web前端

web前端是什么意思,以前都没有听说过.听说最多的就是程序员,传说中的程序员就像个木头人一样,一天就知道敲代码,而且好多都是单身汪.我也没有想过我会接触web前端编程,现在接触了,也开始学习web前端编程. 以前就听说过C语言,现在开始学了才知道编程语言有好多,如Java.C.C++.C#.PHP.Python.VB等,这些也是编程里所说的高级语言.没错 我就是学习的C#语言,但是不是我们看到这个就读C井语言,它叫Csharp语言.我来分享一下我学习的知识. 一.计算机语言是二进制的,源代码计算