meta标签

css基础

由 匿名 (未验证) 提交于 2019-12-02 20:32:16
今天是2019年6月15日周六，老师给我们讲了css的第一节课：css基础部分，写个随笔留个印记！ 一、css的概念 css：cascading style sheet 中午翻译过来就是层叠样式表，它主要是用于定义HTML的内容在浏览器内的显示样式，如文字大小、颜色、字体加粗等 优势：1、实现了内容与表现的分离 　　　 2、提高了代码的可维护性 使用场景：能用css取代Html属性就要用到css，有些属性无法取代：如input属性的 type ，img属性的alt。 二、css的三种引入方式 语法：新增标签的style属性在style属性的值中写css 格式：css属性1：属性值1；css属性2：属性值2； 特点：01，没有实现内容如表现的分离，只针对当前标签有效。 　　　02，优先级别最高 使用场景：通过js动态给一些元素加样式 <body> <div style="width:100px;height:100px;background:red;"> </div> </body> 语法：在头部新增style标签，在style标签的内容中写css。 选择器：规定了页面上哪些元素可以使用定义好的css 格式：选择器 { 　　　　css属性：属性值； 　　　} 特点：01，没有实现内容与表现的分离 使用场景： 没有使用场景 <!DOCTYPE html> <html> <head>

前端 html iframe标签 嵌套显示url

由 匿名 (未验证) 提交于 2019-12-02 20:32:16
例如：在页面嵌套上显示百度 <iframe src="url"></iframe>显示其他url也可以 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Title</title> </head> <body> <iframe src="http://www.baidu.com"></iframe> </body> </html>

CSS样式（一）

由 匿名 (未验证) 提交于 2019-12-02 20:21:24
1、background,height,width 这三个属性在之前里已经用过很多次了，不再赘述 2、border 边框 3、font-size、font-weight font-size 字体大小 :xxpx ，font-weight 字体加粗，bold 粗体：700， bolder 更粗字体，lighter 更细字体，normal 默认字体：400 把上面1-3的属性合起来，看下面这段代码 <! DOCTYPE html > < html lang ="en" > < head > < meta charset ="UTF-8" > < title > Title </ title > </ head > < body > < div style ="height: 100px;width:100px;border: 2px red solid; font-weight: bolder;font-size: 50px" > 测试 </ div > </ body > </ html > 在100*100边框为2像素红色实体框中有内容：测试中，测试中三个字的大小为50像素、更粗字体，如下： 4、text-align 文本水平对齐方式 正常文字上左上角对齐的，如图： 现在需要文字水平居中，则在style属性中增加text-align:center，代码如下： <! DOCTYPE

移动端（视口(meta)，像素比，常见屏幕尺寸）

由 梦想与她 提交于 2019-12-02 19:58:10
1. 视口：(布局视口(layout viewport)，视觉视口(visual viewport)，理想视口(ideal viewport)) 　meta 视口标签 <meta name = "viewport" content = “ width = device-width，user-scalable = no，initial-scale = 1.0，maximum-scale = 1.0，minimum-scale = 1.0” 　width：宽度设置的是 viewport 宽度，可以设置 device-width(设备宽度)特殊值 　user-scalable：用户是否可以缩放，yes 或者 no（1 或者 0） 　initial-scale：初始缩放比，大于 0 的数字 　maximum-scale：最大缩放比，大于 0 的数字 　minimum-scale：最小缩放比，大于 0 的数字 　标准的 viewport 设置 　　视口宽度和设备保持一致 　　视口的默认缩放比例1.0 　　不允许用户自行缩放 　　最大允许的缩放比例1.0 　　最小允许的缩放比例1.0 2. 物理像素 & 物理像素比 　物理像素点指的是屏幕显示的最小颗粒（也就是我们说的分辨率），是物理真实存在的，这是厂商在出厂时就设置好的，比如苹果6/7/8 是750*1334 　开发时的 1px 不一定等于

【转】<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">移动设备优先

由 拈花ヽ惹草 提交于 2019-12-02 19:02:28
在网页的 head 之中添加 viewport meta 标签，如下所示： <meta name="viewport" content="width=device-width, initial-scale=1.0"> width 属性控制设备的宽度。假设您的网站将被带有不同屏幕分辨率的设备浏览，那么将它设置为 device-width 可以确保它能正确呈现在不同设备上。 initial-scale=1.0 确保网页加载时，以 1:1 的比例呈现，不会有任何的缩放。 在移动设备浏览器上，通过为 viewport meta 标签添加 user-scalable=no 可以禁用其缩放（zooming）功能。 通常情况下，maximum-scale=1.0 与 user-scalable=no 一起使用。这样禁用缩放功能后，用户只能滚动屏幕，就能让您的网站看上去更像原生应用的感觉。 <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"> 　　 来源： https://www.cnblogs.com/fanmiaolan/p/11759050.html

浏览器端-W3School-HTML：HTML DOM Meta 对象

由 佐手、 提交于 2019-12-02 18:32:41
ylbtech-浏览器端-W3School-HTML：HTML DOM Meta 对象 1. 返回顶部 1、 HTML DOM Meta 对象 Meta 对象 Meta 对象代表 HTML 的 一个 <meta> 元素。 <meta> 元素可提供有关某个 HTML 元素的元信息 (meta-information)，比如 描述、针对搜索引擎 的 关键词以及刷新频率 。 Meta 对象属性 属性 描述 content 设置或返回 <meta> 元素的 content 属性的值。 httpEquiv 把 content 属性连接到一个 HTTP 头部。 name 把 content 属性连接到某个名称。 scheme 设置或返回用于解释 content 属性的值的格式。 2、 2. HTML DOM content 属性 返回顶部 1、 定义和用法 content 属性设置或返回 <meta> 元素的 content 属性的值。 语法 metaObject.content=text 实例 本例的 <meta> 标签为搜索引擎定义了一些关键词。以下代码返回 content 属性的值： <html> <head> <meta name="keywords" content="HTML,DHTML,CSS,JavaScript" /> </head> <body> <script type=

前端 CSS 三种引入方式

由 匿名 (未验证) 提交于 2019-12-02 16:56:17
CSS三种引入方式 行内样式 内接样式 外部样式 链接式 导入式 就是在标签加上style属性设置样式 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Title</title> </head> <body> <!-- 行内样式 --> <div> <p style="color: red">我是一个段落</p> </div> </body> </html> CSS样式写在head标签里面的style标签里面，格式如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="x-ua-compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Title</title> <style> /*

HTML Meta标签知多少

由 六眼飞鱼酱① 提交于 2019-12-02 15:51:37
一、基本属性 标签常常被用来定义HTML文档的元数据或者HTTP协议的指向，这些元数据常用在SEO、HTML Pages or Apps on Mobile/Handheld Devices，该标签主要包括以下属性： Attribute Description Name Name for the property. Can be anything. Examples include, keywords, description, author, revised, generator etc. content Specifies the property's value. scheme Specifies a scheme to interpret the property's value (as declared in the content attribute). http-equiv Used for http response message headers. For example http-equiv can be used to refresh the page or to set a cookie. Values include content-type, expires, refresh and set-cookie. 二、基本的HTML Meta标签 1 2 3

meta标签

由 为君一笑 提交于 2019-12-02 15:09:55
原文： https://www.imooc.com/qadetail/330325 一、http-equiv属性 http-equiv顾名思义，相当于http的文件头作用，它可以向浏览器传回一些有用的信息，以帮助正确和精确地显示网页内容，与之对应的属性值为content，content中的内容其实就是各个参数的变量值。 meta标签的http-equiv属性语法格式是： <metahttp-equiv="参数"content="参数变量值">； 其中http-equiv属性主要有以下几种参数： A、Expires(期限) 说明：可以用于设定网页的到期时间。一旦网页过期，必须到服务器上重新传输。 用法：<metahttp-equiv="expires"content="Fri,12Jan200118:18:18GMT"> 注意：必须使用GMT的时间格式。 B、Pragma(cache模式) 说明：禁止浏览器从本地计算机的缓存中访问页面内容。 用法：<metahttp-equiv="Pragma"content="no-cache"> 注意：这样设定，访问者将无法脱机浏览。 C、Refresh(刷新) 说明：自动刷新并指向新页面。 用法：<metahttp-equiv="Refresh"content="2;URL=http://www.jb51.net">(注意后面的引号

前端-强制页面不缓存

由 我与影子孤独终老i 提交于 2019-12-02 11:43:57
　　有两种方式强制页面不缓存： 　　1.手动添加版本号 <link rel="stylesheet" type="text/css" href="/css/user.css?v=201806251715" /> <script src="/js/userinfo.js?v=201906223715"></script> 　　2.添加meta标签 <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> <meta http-equiv="Pragma" content="no-cache" /> <meta http-equiv="Expires" content="0" /> 　　 来源： https://www.cnblogs.com/belongs-to-qinghua/p/11743484.html
订阅 meta标签