meta标签

HTML5中的一些meta标签

瘦欲@ 提交于 2019-12-04 20:29:48
<!DOCTYPE html> H5标准声明,使用 HTML5 doctype,不区分大小写 <head lang=”en”> 标准的 lang 属性写法 <meta charset=’utf-8′> 声明文档使用的字符编码 <meta http-equiv=”X-UA-Compatible” content=”IE=edge,chrome=1″/> 优先使用 IE 最新版本和 Chrome <meta name=”description” content=”不超过150个字符”/> 页面描述 <meta name=”keywords” content=””/> 页面关键词 <meta name=”author” content=”name, email@gmail.com”/> 网页作者 <meta name=”robots” content=”index,follow”/> 搜索引擎抓取 <meta name=”viewport” content=”initial-scale=1, maximum-scale=3, minimum-scale=1, user-scalable=no”> 为移动设备添加 viewport <meta name=”apple-mobile-web-app-title” content=”标题”> iOS 设备 begin <meta name=

【前端知识体系】CSS布局知识强化

给你一囗甜甜゛ 提交于 2019-12-04 18:28:13
1.实现两栏/三栏布局的方法? 表格布局 float + margin布局 inline-block布局 flexbox布局(兼容性的问题) 1.1 基础布局 <style> * { margin: 0; padding: 0; } .layout { margin-top: 10px; } .layout div{ min-height: 100px; } </style> <body> <!--1.浮动的方式来实现布局--> <section class="layout float"> <style> .layout.float .left { float: left; width: 300px; background-color: #48adff; } .layout.float .main { background-color: #ff4344; } </style> <article class="left-main"> <div class="left"></div> <div class="main"> <h1>浮动两栏布局</h1> <p>两栏布局的中间部分</p> <p>两栏布局的中间部分</p> </div> </article> </section> <!--2.定位的方式来实现布局--> <section class="layout absolute">

front-end-checklist-4

老子叫甜甜 提交于 2019-12-04 16:45:19
Based on https://github.com/thedaviddias/Front-End-Checklist 8. Language attribute 1 <html lang="en"> (1) lang 属性规定元素内容的语言。 (2) HTML5中强烈建议为 html 根元素指定 lang 属性,从而为文档设置正确的语言。这将有助于语音合成工具确定其所应该采用的发音,有助于翻译工具确定其翻译时所应遵守的规则等等。 9. Social meta 1234567891011121314151617181920 <meta property="og:type" content="website"><meta property="og:url" content="https://example.com/page.html"><meta property="og:title" content="Content Title"><meta property="og:image" content="https://example.com/image.jpg"><meta property="og:description" content="Description Here"><meta property="og:site_name" content="Site Name">

HTML

眉间皱痕 提交于 2019-12-04 16:30:02
1.html5的新特性 文件类型声明(<!DOCTYPE>)仅有一型:<!DOCTYPE HTML>。 新的解析顺序:不再基于SGML。 绘画 canvas; 用于媒介回放的 video 和 audio 元素; 语意化更好的内容元素:article、footer、header、nav、section; 表单控件:calendar、date、time、email、url、search; input元素的新类型:date, email, url等。 新的技术: webworker, websocket, Geolocation; 新的属性:ping(用于a与area), charset(用于meta), async(用于script)。 全域属性:id, tabindex, repeat。 新的全域属性:contenteditable, contextmenu, draggable, dropzone, hidden, spellcheck。 新应用程序接口: HTML Geolocation HTML Drag and Drop HTML Local Storage HTML Application Cache HTML Web Workers HTML SSE HTML Canvas/WebGL HTML Audio/Video 移除的元素: 纯表现的元素:basefont,big

day44 css

梦想与她 提交于 2019-12-04 12:12:30
css样式操作 给标签设置长宽 只有块级标签才可以设置长宽,行内标签设置了没有任何作用(仅仅只取决于内部文本值) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> div { width: 200px; height: 400px; } span { width: 50px; height: 50px; } </style> </head> <body> <div> div </div> <span>span</span> </body> </html> 字体属性 font-family: 字体类型 font-size: 字体大小 font-weight: 字体粗细 值|描述 :-:|:-: normal|默认值,标准粗细 bold|粗体 bolder|更粗 lighter|更细(***************) 100~900|设置具体粗细,400等同于normal,而700等同于bold inherit|继承父元素字体的粗细值 color: 字体颜色 颜色英文 red 06a0de 直接用python提供的取色器即可 rgb(1,1,1) 可以利用截图软件获取三基色数字 rgba(128,128,128,0.6) 最后一个数字

vue基础(2)

二次信任 提交于 2019-12-04 11:35:31
目录 1. 表单指令 2. 斗篷指令 3. 条件指令 4. 条件指令案例 5. 循环指令 6. 循环指令案例分析 7. 分隔符成员 8. 计算属性成员 9. 属性的监听 10. vue组件 11. 子组件 1. 表单指令 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>表单指令</title> </head> <body> <div id="app"> <form action=""> <!--属性指令:v-model="变量",v-model绑定的变量控制的是表单元素的value值 --> <!--普通表单元素,用v-model直接绑定变量控制value值--> <input type="text" v-model="v1"> <input type="text" v-model="v1"> <textarea name="" id="" cols="30" rows="10" v-model="v1"></textarea> <p>{{ v1 }}</p> <hr> <!--单一复选框--> 同意: <input type="checkbox" name="agree" v-model="v2"> <hr> <!--多个复选框--> 男:<input type="checkbox"

JavaScript学习笔记(五) jQuery

a 夏天 提交于 2019-12-04 10:43:33
jQuery 是一个 JavaScript 函数库,兼容目前绝大部分的浏览器,概括来说包含如下功能: 元素选取 元素操作 样式设置 事件操作 过渡与动画 AJAX 1、安装 (1)在 官网 中下载 jQuery,在项目中通过 <script> 标签引入 jQuery 提供两个版本可供下载,分别是 生产版本(用于实际上线) 和 开发版本(用于开发测试) 下载下来的 jQuery 是一个 JavaScript 文件,在项目中可以通过 <script> 标签引入 (2)直接通过 CDN 引入 也可以通过 CDN 引入 jQuery,这里以官方的 CDN 为例 <script src="http://code.jquery.com/jquery-3.4.1.min.js"></script> 2、语法 (1)基础语法 只要学习过 HTML、CSS、JavaScript 的朋友,一定会觉得 jQuery 的语法十分熟悉 一条独立的 jQuery 语句可以分为三个部分, $(selector).action() $ :jQuery 的全局引用 selector :选择特定的 HTML 元素 action :对选择的元素进行操作 (2)执行入口 为了防止在文档完全加载之前运行 jQuery 代码,我们一般会把 jQuery 代码写在下面的回调函数中 // 常规语法 $(document)

day45

你离开我真会死。 提交于 2019-12-04 10:21:29
form表单(**************) 能够获取用户输入(输入,选择,上传的文件) 参数 action 控制数据提交的地址 三种书写方式 1.不写 默认就是朝当前页面所在的地址提交数据 2.写全路径( https://www.baidu.com ) 3.只写路径后缀( /index/ ) method 控制数据提交的方式 get from 表单默认是 get 请求 post ==通常情况下 input 需要结合 label 一起使用== 用户名: 绑定id值,之后点击label标签内任何的位置都可以自动选中 input 框 用户名: 根据type参数的不同,展示不同的功能 Copytext 普通文本 password 输入的内容,会变成密文 date 日期 radis 单选圆圈 checkbox 多选 打钩 hidden 隐藏 file 传文件 button 普通按钮,没有任何意义,然而是用的最多的,可以绑定js事件 reset 重置按钮 submit 提交按钮,能够自动触发form表单提交数据的动作 select标签 下拉框 一个个的option标签就是一个个的选项 默认为单选 可以给 select 标签加一个 multipe 参数,就可以将单选变成多选 textarea标签 可获取大段文本 Copyinput标签可以加disable属性,禁用该input框

html--前端css样式初识

你离开我真会死。 提交于 2019-12-04 09:36:58
一、CSS概述 css是英文Cascading Style Sheets的缩写,称为层叠样式表,用于对页面进行美化,CSS的可以使页面更加的美观。基本上所有的html页面都或多或少的使用css。 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问题 外部样式表可以极大提高工作效率 外部样式表通常存储在 CSS 文件中 多个样式定义可层叠为一 二、css样式的引入方法 1、行内式 行内式是在标记的style属性中设定CSS样式。这种方式没有体现出CSS的优势,不推荐使用。 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>Document</title> 8 </head> 9 <body> 10 <a style="background-color: aqua;color:

html5响应式布局

无人久伴 提交于 2019-12-04 08:42:23
一、首先,在<head>标签下,设置<meta>标签 1 <!--设置meta标签,可以强制打开ie的edge模式--> 2 <meta http-equiv="X-UA-Compatible" content="IE=EDGE"> 3 <!--响应式自适应> 4 <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no"> 二、宽度最好不要用绝对 最好用这种:width:auto/ width:XX% 三、字体大小不要用px,用rem 来源: https://www.cnblogs.com/lwyKunKun/p/11850437.html