起名方式与CSS

一.起名方式(起名方式也叫选择器)

起名的目的是为了给标签添加属性

常见的3种选择器有 标签选择器   id选择器(使用的时候加#)    class选择器(使用的时候加.)

样式的要求是由选择器的权重来决定的

标签的权重为1  class的权重是10 id的权重是100

权重是可以叠加的。

比如

注意给一个标签起两个名字的时候千万不要这样起:

要在一个class或者id属性里面直接写两个名字的属性值 在两个名字之间加一个空格来区分两个名字:

之前咱们说了选择器有标签名 id class 其实选择器有很多种

1.后代选择器(使用的时候在父标签名和子标签名之间加一个空格)

<p>

  段落里的文字

  <a>这里的内容就会是红色</a>

</p>

标签嵌套多层关系(包含一层)

2.子代选择器

<div class="pp">

  <a>这里会是红色<a>这里就不会变</a></a>

</div>

标签嵌套只有一层关系

3.交集选择器(给一个标签起多个名字来单独修改这条标签的样式)

<div id="p" class="aa"></div>

4.通配符选择器(全选)

使用通配符选择器会加大浏览器的负荷

5.并集选择器

补充:在样式属性值后面加一个!importank表示权重无限大(表示这条样式权重最大不会被修改)

CSS

css(层叠样式表)就是给html添加样式

网页中有四种style样式

1.行间样式 将style当做属性写在标签内。(权重1000)

2.行内样式 把style当做标签来用 写在head之间

3.外部引用(把style当做css文件来用)(在head里加一条<link type="text/css" rel="stylesheet" href="css路径">)

这里的type可以舍去因为href后面的文件名是.css会默认这条标签是css

rel和href 是必不可少的。

4.嵌入式(这个前期一般用不到)

就是一个css样式表里引入另一个的css样式表

从零开始的全栈工程师——html篇1.2的更多相关文章

  1. 从零开始的全栈工程师——html篇1

    全栈工程师也可以叫web 前端 H5主要是网站 app 小程序 公众号这一块 HTML篇 html(超文本标记语言,标记通用标记语言下的一个应用.) “超文本”就是指页面内可以包含图片.链接,甚至音乐 ...

  2. 从零开始的全栈工程师——js篇2.5

    数据类型与全局属性 js的本质就是处理数据 数据来自于后台的数据库所以变量就起到一个临时存储数据的这作用ECMAscirpt 制定了js的数据类型 一.数据类型 1.基本数据类型 基本数据类型就是简单 ...

  3. 从零开始的全栈工程师——js篇2.1(js开篇)

    JS开篇 一.js介绍 全称 javascript 但不是java 他是一门前台语言 而java是后台语言js作者 布兰登·艾奇 前台语言:运行在客户端的后台语言:跟数据库有关的 能干什么?    页 ...

  4. 从零开始的全栈工程师——html篇1.7

    position定位与表单 一.position 1.Position细说 Position:relative; Left:100px; Top:100px; Position:absolute; L ...

  5. 从零开始的全栈工程师——html篇1.5

    列表与边距探讨和行块 一.列表 1.无序列表(UL) 1)内部必须有子标签<li></li>2)天生自带内外边距 p也是自带 大家会发现用UL的时候内容前面会出现一个像这样的一 ...

  6. 从零开始的全栈工程师——html篇1.4

    背景与边框 一.背景(backgound) 1.背景颜色:background-color:red;(简写:background:color;) 备注:ie9以下给body设置background-c ...

  7. 从零开始的全栈工程师——html篇1.3

    文本.字体css样式与前期英语单词汇总 一.文本样式(text) 1.颜色:color:red; 2.文本对齐方式:text-align:left/center/right/justify; left ...

  8. 从零开始的全栈工程师——PHP篇 ( 单词汇总 ) ( php解决文字乱码 )

    解决乱码: header("Content-Type: text/html;charset=utf-8"); 单词 局部的: local 全局的: global 静态的: stat ...

  9. 从零开始的全栈工程师——js篇(cookie)

    Cookie是由服务器端生成,发送给User-Agent,浏览器会将Cookie的key/value保存到某个目录下的文本文件内,下次请求同一网站时就发送该Cookie给服务器,对cookie知识感兴 ...

随机推荐

  1. SHELL编程之条件判断

    一.if 语句结构 (1)单分支语句结构 if  条件测试操作 then  命令序列 fi #!/bin/bash MOUNT_DIR="/media/cdrom/" #-d $M ...

  2. get与post中文乱码问题

    Jsp默认的字符编码格式是iso-8859-1 因为post方法与get方法传递参数的方式不一样,所以有不同的解决方法. 一.post乱码解决方法: 1.设置请求和响应的编码方式 //设置请求的编码格 ...

  3. CSS复合选择器

    复合选择器是由两个或多个基础选择器,通过不同的方式组合而成的,目的是为了可以选择更准确更精细的目标元素标签. 交集选择器 交集选择器由两个选择器构成,其中第一个为标签选择器,第二个为class选择器, ...

  4. Jquery each ajax 赋值

    <script type="text/javascript"> $(document).ready(function () { $("#mylist li s ...

  5. DataRow[]转DataTable

    DataRow[]有个扩展方法CopyToDataTable()

  6. 使用TortoiseSVN新建及合并分支图文教程

    打开trunks目录,在trunks目录下新建两个文本文件A.java,B.java:   打开A.java输入以下内容: B.java文件可以随机输入些,本例中主要用于观察后续是否变化. 两个文件编 ...

  7. 解析图书 XML

    Java代码: package com.thinkgem.jeesite.test; import org.dom4j.Attribute; import org.dom4j.Document; im ...

  8. anaconda 换源

    2019.4.24更新: 清华源停止维护了(见:https://mirrors.tuna.tsinghua.edu.cn/news/close-anaconda-service/).以下方法不再适用. ...

  9. pip不是内部或外部命令也不是可运行的程序或批处理文件的问题

    当我用windows电脑 pip install missingno 时 它居然会报pip不是内部或外部命令也不是可运行的程序或批处理文件的问题! 解决方法: 1)找到 pip.exe 所在位置,一般 ...

  10. Vue-cli 构建项目 的`.vue`组件中, scss中添加背景图路径问题

    [解决方法]: 更改build/utils.js文件中的 ExtractTextPlugin 的 options配置. if (options.extract) { return ExtractTex ...