码迷,mamicode.com
首页 > 其他好文 > 详细

前端3剑客

时间:2018-09-19 23:26:59      阅读:138      评论:0      收藏:0      [点我收藏+]

标签:lin   引擎   地址   选择器   html标签   结束   前端   hello   seo   

前端三剑客
html
html为标记语言
标记语言为非编程语言,不具备编程语言的程序逻辑

html为前端页面的主体,由标签。指令与转义字符(实体)等组成

标签:被尖括号包裹,由字母开头包含合法字符的,可以被浏览器解析的标记。(系统标签,自定义标签)
指令:被尖括号包裹,由!开头的标记<!doctype html> <!-- -->
转义字符:被&与;包裹的特殊字母组合或#开头的十进制数
&#60; &#62; &nbsp;

css
css 为标记语言
css为前端页面的样式,由选择器。作用域与样式快组成

选择器:由标签,类,id单独或组合出现
作用域:一组大括号包含的区域
样式快:满足css链接语法的众多样式


js
js是编程语言,有完善的语法,可以完成复杂的程序逻辑
dom:文档对象模型
bom:浏览器对象模型
es:es是一种脚本语言规范

<!doctype html>
<html>
<head>
<meta/>
<title></title>
</head>
<body>
</body>
</html>
模板解读:
doctype:指定文档类型,规定html标签语法
html:文档根标签,标注着文档(页面)的开始与结束
head:文档头标签,可以引用脚本文件。指定样式表,书写代码逻辑块,提供元信息
body:文档主体标签,包含文档所有文本与超文本内容
title:文档tag标题标签,设置文档tag标题内容

其他核心模板标签

head内常用标签
meta 相关
1.指定字符集
<meta charset=‘utf-8‘>

2页面描述
<meta name =‘description‘ content=‘具体描述...‘>

3.关键字:有助于搜索引擎seo优化
<neta name=‘keywords‘ content=‘网站的相关关键字...‘>


4.3秒后跳转

<meta http-equiv=‘refresh‘ content=‘3,http://baidu.ocm‘>

5.3秒刷新

<meta http-equiv=‘refresh‘ content=‘3‘>

非meta相关标签
1.标题

<title>顶顶顶顶</title>

2.网站图标

<link rel=‘icon‘ href= ‘图标地址‘>"

#https://www.baidu.com/favicon.ico"


3.定义内部样式

<style></style>


4.引入外部样式文件

<link rel=‘stylesheet‘ href=‘mystyle.css‘>

#5、定义JavaScript代码或引入JavaScript文件
<script src="hello.js"></script> 

 

html 常用标签
1.无语义标签
<div></div>
<span></span>

2.常用语义标签
<hn></hn>标题
<p></p>段落
<pre></pre>原文本
<br>换行
<hr>分割线


3.文本标签

<i></i>斜体字

<em></em>斜体字,表示强调

<b></b>粗体字

<strong></strong>粗体字,表示强调
<ins></ins>插入的文本

<del></del>删除的文本

<sub></sub>下标字

<sup></sup>上标字

<ruby>你好<rt>nihao</rt><ruby>

4.其他标签

<section></section>块

<small></small>小号字体

 

前端3剑客

标签:lin   引擎   地址   选择器   html标签   结束   前端   hello   seo   

原文地址:https://www.cnblogs.com/fushaunglin/p/9678149.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!