<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>

/*全局设置,外边距*/
*{
margin: 0px;
padding: 0px;
}

/*id选择器*/
#d1{
width: 300px;
height: 200px;
background-color: greenyellow;
}

/*class选择器*/
.d3{
width: 300px;
height: 200px;
background-color: lightseagreen;
}

/*标签选择器*/
div{
border: solid black 5px;
}

/*不常用选择器*/
[name=N1]{
width: 300PX;
height: 100PX;
background-color: red;
}

/*并列选择器*/
.d4,.d5{
width: 300px;
height: 200px;
background-color: hotpink;
}

/*单独改字体,并不改其他的字体*/
.c6 span{
color: red;
width: 300px;
height: 200px;
}

/*并列选择器*/
.x1{
width: 300px;
}
.x2{
height: 200px;
}
</style>

<link type="text/css" rel="stylesheet" href="css/sdtyle1.css"/>
</head>

<body>
<!--第一种直接写--> <!--但是这种方式是最后用的-->
<div style="width: 300px; height: 200px; background-color: red;">这是第一种选择器</div>

<!--第二种用选择器-->
<div id="d1">这是第二种id选择器</div>

<!--第三种引入css文档-->
<div id="div2">这是第三种选择器</div>

<div class="d3"></div>
<!--选择器问题-->

<!--id name class-->
<!--不常用选择器-->
<div name="N1"></div>

<!--并列选择器-->
<div class="d4"></div>
<div class="d5"></div>

<!--子代选择器-->
<div class="c6">
<span>啦啦啦啦啦啦</span>
</div>
<span>啦啦啦啦啦</span>

<!--另类并列选择器x1和x2-->
<div class="x1 x2"></div>

<!--(敲黑板)优先级的问题,总的来说后面的代码优先级高-->

</body>
</html>

以上就是我学习和整理的内容,希望看到的同学对里面错误和不合适的地方进行指正,谢谢。

~~明天,又是充满希望的一天。

PHP初入,基础知识点整理(样式表&选择器的使用整理)的更多相关文章

  1. PHP初入,基础知识点分享(a标签&表格的嵌套&文字的处理)

    <!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> ...

  2. 网页制作之html基础学习3-css样式表

    样式:CSS(Cascading Style Sheets,层叠样式表),作用是美化HTML网页. 在样式里面用 /*  */ 进行注释. 1.样式表的基本概念 1.1.样式表分类 1.内联样式表 和 ...

  3. CSS样式表基础知识、样式表的分类及选择器

    一.CSS基本概念: CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/    此为注释语法 二.样式表的分类 1.内联样式表(和html联合 ...

  4. 前端基础之css样式(选择器)

    一.css概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,对html标签的渲染和布局 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如 二.c ...

  5. Qt样式表——选择器详解(父子关系)

    在上一节中,小豆君给大家介绍了样式表的基本概念和大致用法.今天我们来详细了解下样式表中选择器的用法. 所谓选择器,就是指定你所设置的样式对哪个或哪些控件起作用. 到目前为止,Qt样式表支持CSS2中定 ...

  6. CSS样式表 选择器

    1.内联样式表 和HTML联合显示,控制精确,但是可重用性差,冗余较多. 例:<p style="font-size:14px;">内联样式表</p> &l ...

  7. Html 初识样式表&选择器

    样式表&类选择器分类 样式表分类: 1.内联式样式表:在标签内部写样式代码,精确但不方便,增加工作量,后期修改麻烦. 2.嵌入式样式表:一般写在head内 以<style>.... ...

  8. java基础57 css样式、选择器和css定位(网页知识)

    本文知识点(目录): 1.CSS样式    2.选择器    3.CSS定位 1.CSS样式 1.html 在一个网页中负责的是一个页面的结构    2.css(层叠样式表)在一个页面中负责了一个页面 ...

  9. CSS基础知识点(二)——选择器

    在这一篇中,主要总结一下CSS中的选择器. 参考:http://www.cnblogs.com/webblog/archive/2009/07/07/1518274.html CSS中的选择器主要包括 ...

随机推荐

  1. 6-最基础的服务-es6写法

    创建server.js 'use strict'; //http模块 var http = require('http'); //封装的方法 var handlers = require('./han ...

  2. 使用Node.js调用阿里云短信的发送以及接收

    为了使用Node.js调用阿里云短信服务,我自己写了个npm包, 目前实现了: 使用Node.js调用阿里云短信服务,发送短信: 使用Node.js调用阿里云短信服务以及MNS服务,接收用户上行短信 ...

  3. MongoDB3.4安装配置以及与Robomongo1.1的连接——解决Authentication Failed导致的不能连接问题

    本文环境:win10(64)+MongoDB(3.4.5)+Robomongo(1.1) 目录: MongoDB的安装 MongoDB的配置 Robomongo的安装以及与MongoDB的连接 一些新 ...

  4. 为什么是Spring Boot

    原文:https://dzone.com/articles/why-springboot 作者:Siva Prasad Reddy Katamreddy 译者:Oopsguy 本文介绍将各种Sprin ...

  5. ios扫雷

    就这些代码敲了我两个小时...... //  ViewController.m //  扫雷 // //  Created by 晚起的蚂蚁 on 2017/3/22. //  Copyright © ...

  6. Spring整合CXF webservice restful 实例

    webservice restful接口跟soap协议的接口实现大同小异,只是在提供服务的类/接口的注解上存在差异,具体看下面的代码,然后自己对比下就可以了. 用到的基础类 User.java @Xm ...

  7. Spring思维导图(MVC篇)

    写在前面 生活就像海洋,只有意志坚强的人才能到达彼岸. 已经很久没有发文章了呀,想必大家都挂念我了,哈哈. 温故而知新,今天一起来复习一下spring mvc的内容吧. spring mvc简介与运行 ...

  8. 重构tableview!

    昨天用字典构筑tableview简直愚蠢!不过蠢过才知道如何写出好的代码.下面将用模型重构tableview! -------------------------------------------- ...

  9. CSS学习笔记!

    一.关于图像RGB值和像素值的确定! 腾讯QQ截图软件Ctrl+Alt+A进入截图界面,鼠标变成彩色,便会拾取鼠标当前颜色,再按住Ctrl切换到十六进制格式#******.图像的像素值也在截取框内显示 ...

  10. Kotlin 初窥门径[2]:流程控制

    流程控制语句是编程语言中的核心之一.可以分为分支语句.循环语句和跳转语句.本文将详细介绍一下 Kotlin 中的流程控制语句. If 表达式 在Kotlin中一切都是表达式,也就是说一切都返回一个值. ...