html(常用标签,标签分类),页面模板, CSS(css的三种引入方式),三种引入方式优先级
HTML
标记语言为非编程语言
负责完成页面的结构
组成:
标签:被<>包裹的由字母开头,可以结合合法字符( -|数字 ),能被浏览器解析的特殊符号,标签有头有尾
指令:被<>包裹的由 ! 开头
转义字符:
空格 < : < > : >
页面模板
<!doctype html>
<!--页面开始-->
<html>
<!--头-->
<head>
<!--字符编码-->
<meta charset="utf-8">
<!--页面标签的标题-->
<title>页面</title>
<!--内部或外部的css样式 | js脚本 | 页面其他设置 --> </head>
<!--身体-->
<body>
<!--存放给展示用户的内容-->
xx
</body> <!--页面结束-->
</html>
常用标签
最常用标签:没有语义,也没有特殊功能,也没有特殊样式
<div></div>
换行标签: <br> 标题标签: h1 - h6
段落标签: <p>xxx</p> 段落与段落之间间隔很大
文本标签:同行显示
span 文本标签 i 斜体
em 斜体方式强调 b 加粗
strong 加粗方式强调 sup 上角标
sub 下角标
超链接标签:a
<a href="连接地址" target="_blank">超链接</a>
href="连接地址" arget="_blank/_self" 属性表示新开一个窗口 锚点:快速定位到页面指定位置
<a name='top'></a> 通过 a 的 name 设置锚点
<a href='#top'>返回Top</a> 再通过 a 的 href 属性转跳到锚点位
图片标签
<img src="图片地址" alt="资源加载失败显示的文字" title="鼠标悬浮显示文字提示">
列表标签: ul ol
有序:
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul> 无序:
<ol>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ol>
表格标签 table
border: 表格边框宽度
cellspacing: 单元格之间的距离
rules: all(全部) | groups(组线) | rows(行线) | cols(列线)
cellpadding: 内容距上距左的距离 <table border="10" width="500" height="300" cellspacing="0" rules="all" cellpadding="20">
<caption>表格标题</caption>
<thead>
<tr>
<!--th{标题}*3-->
<th>标题</th>
<th>标题</th>
<th>标题</th>
</tr>
</thead>
<tbody>
<!--(tr>td{单元格}*3)*2-->
<tr>
<td>单元格</td>
<td>单元格</td>
<td>单元格</td>
</tr>
<tr>
<td>单元格</td>
<td>单元格</td>
<td>单元格</td>
</tr>
</tbody>
<tfoot>
<!--tr>td{单元格}*3-->
<tr>
<td>单元格</td>
<td>单元格</td>
<td>单元格</td>
</tr>
</tfoot>
</table>
了解
分割线: <hr> (了解)
显示文本:<pre></pre>
标签分类
单标签 br hr img meta link 功能具体,不需要内容,设置为单标签 eg:<link rel="stylesheet" href="">
双标签 h1 p span div 具有子标签,包含内容 eg:<h1>内容</h1>
css
负责页面的风格设计
选择器:由标签,类,id单独组合出现
作用域:一组打括号包含的区域
样式块:满足css连接语法的众多样式
css的三种引入方式
1.行间式
样式块写在标签的style的属性中
属性 与 属性 间用 ; 分号隔开 <div style="color: red"></div>
2.内联式
写在style标签中
用选择器与html建立连接 <style type="text/css">
.farther div {
color: red;
font-size: 100px;
float: right;
}
</style>
3.外联式
css外式完全与html文件脱离,形成单独的.css文件,样式书写在.css文件中
用 link 标签将css文件与 html 建立连接
< link rel="stylesheet" href="" > rel="stylesheet" 表示连接什么样的文件,样式连接表
三种引入方式的执行顺序:
外联 < 内联 < 行间 行间式最后执行
html(常用标签,标签分类),页面模板, CSS(css的三种引入方式),三种引入方式优先级的更多相关文章
- css中常用的标签
最常用的标签 left 左 top 上 right 右 bottom 下 font 字体 size 大小 width 宽度 height 高度 class 类 label 标签 form 表单 gro ...
- HTML&CSS基础-html常用的标签
HTML&CSS基础-html常用的标签 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html的源代码 <!DOCTYPE html> <html& ...
- Python 44 前端概述 、三剑客 、常用标签与分类
1.前端三剑客是哪三位?文件的后缀内容?在前端开发中的功能是什么? HTML: .htm .html 内容 CSS: .css 效果 JS: .js 行为 2.简述三剑客的主要 ...
- 常用HTML标签元素结合及简介
常用HTML标签元素结合及简介 <html></html> 创建一个HTML文档<head></head> 设置文档标题和其它在网页中不显示的信息< ...
- python Django教程 之模板渲染、循环、条件判断、常用的标签、过滤器
python3.5 manage.py runserver python Django教程 之模板渲染.循环.条件判断.常用的标签.过滤器 一.Django模板渲染模板 1. 创建一个 zqxt_tm ...
- 标签语义化之常用HTML标签
一.布局的理解误区 网络上流行管新型的布局方式叫“DIV+CSS”,其实是一个错误的理解,导致了很多人过度依赖与滥用DIV标签, HTML提供了我们一共七八十个标签,其中常用的有三十个左右,DIV不过 ...
- phpcms v9 常用调用标签(全)
本文介绍phpcms v9中模板标签使用说明. {template ) {==} {/,,)} loop是data的时候用{thumb($v[thumb],,)} 分页标签------{$ ...
- web前端开发常用的10个高端CSS UI开源框架
web前端开发常用的10个高端CSS UI开源框架 随着人们对体验的极致追求,web页面设计也面临着新的挑战,不仅需要更人性化的设计理念,还需要设计出更酷炫的页面.作为web前端开发人员,运用开源 ...
- WordPress主题制作教程6:常用模版标签
在wordpress中,模板标签指一些字段,比如标题,内容,作者,发布日期,评论数等等,获取静态值和循环里面经常使用. 输出模板标签一般有两种方式:the_yourtag() 输出标签值和get_th ...
- HTML标签元素分类(HTML基础知识)
HTML标签元素分类 一.按照块级元素还是行内元素分类 块级元素(block-level)和行内元素(inline-level,也叫作"内联"元素). a.块级元素(独占一行) 块 ...
随机推荐
- ans Single VIP LLB and SLB config
ans Single VIP LLB and SLB config 配置命令: # 配置设备工作模式和开启的功能 > enable ans mode FR MBF Edge USNIP L3 P ...
- luogu1484 种树 (优先队列)
我每次都想选那个最大的.或者是它旁边的两个一起选,如果这两个一起选会大于那个最大的的话 那我就先把那个最大的选了,再提供一个反悔的选项(类似于网络流的思路?),就是我可以再把种的树换成它旁边那两个,也 ...
- hdu 3374 String Problem(kmp+最小表示法)
Problem Description Give you a string with length N, you can generate N strings by left shifts. For ...
- js定时器setInterval()与setTimeout()
js定时器setInterval()与setTimeout() 1.setTimeout(Expression,DelayTime),在DelayTime过后,将执行一次Expression,setT ...
- 洛谷P2486 染色
LCT的一种姿势. 题意:给定一棵树.每次把一条路径上的点染成一种颜色,求一条路径上有多少段颜色. 解: 首先可以很轻易的用树剖解决,只不过代码量让人望而却步... 有一种难以想象的LCT做法... ...
- 【CF1042D】Petya and Array 离散化+树状数组
题目大意:给定一个长度为 N 的序列,给定常数 t,求有多少个区间 [l,r] 满足 \(\sum\limits_{i=l}^{r}a_i<t\). 题解:先跑一边前缀和,问题等价于求有多少个数 ...
- 在html页面通过js实现复制粘贴功能
前言:要实现这个功能,常用的方式大概分为两类,第一种就是上插件,这个网上有大把,第二种就是直接用几行JS来实现. 这次说第二种实现方式,这方式有很大的局限性,只能用表单元素,并且不能设置disable ...
- interface 界面&接口
接口:接口(硬件类接口)是指同一计算机不同功能层之间的通信规则称为接口.接口(软件类接口)是指对协定进行定义的引用类型. 界面:窗口,显示 英文解释都是interface partly from ba ...
- linux系统调用之系统控制
ioctl I/O总控制函数 _sysctl 读/写系统参数 acct 启用或禁止进程记账 getrlimit 获取系统资源上限 setrlimit 设置系统资源上限 getrusage 获取系统资源 ...
- 表格中的checkbox复选框 全选非全选 公共方法 及提交选中结果
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...