HTML中Css详细介绍

一、样式表的作用
  1、Css样式表,层叠样式表
  2、类似于人类的衣服,网页的衣服
  3、作用:美化网页
  4、优势:

    1.内容与表现分离,便于维护
    2.样式丰富,页面布局灵活
    3.提高页面的访问速度,减少网络的带宽
    4.有利于被seo收录
二、样式表的类型
  1.行内样式表 <html标记 p style="属性:值;......"></html 标记>
  2.内部样式表——写在<head></head>中的<style>标签中
  <head>
  <style type="text/css>"</head></style>
  选择器(属性:值)
  3.外部样式表
  单独的拓展名为css的文件
在文件中,直接编写【选择器】就可以了
在网页中,连接外部的样式表拓展名为css的文件 P103 <link type="text/css" rel="stylesheet" hre表文件"/>
三、CSS表的语法
选择器的名{网页的属性:值;...............}
1.标签选择器--html标记
  1.会自动应用的网页的标签上面
2.类选择器--.选择器名{属性:值}
  在需要应用选择器的html标记中,添加属性值
  <html 标记 class="类选择名">
3.ID选择器--#选择器名{属性:值}

四、样式表和选择器的优先
  行内样式>内部样式表>外部样式表 ID>类选择器>标签

时间: 2024-10-11 01:49:48

HTML中Css详细介绍的相关文章

Laravel 模板引擎Blade中标签详细介绍

这篇文章主要介绍了Laravel模板引擎Blade中section的一些标签的区别介绍,需要的朋友可以来看看. Laravel 框架中的Blade模板引擎很好用,但是官方文档介绍的并不详细,我接下来将详细的介绍下: @yield与@section 首先,@yield是不可拓展的,如果你要定义的部分没有默认内容让子模版扩展,那么用@yield($name,$default)的形式会比较方便,如果你在子模版中并没有指定这个区块的内容,它就会显示默认内容,如果定义了,就会显示你定义的内容. 与之比较,

Unity3D中GameObject 详细介绍

通过Hierarchy面板下的Create菜单可以手动地创建一个GameObject,它可以是一个相机,一个灯光,或者一个简单的模型,当我们要在程序里面动态地创建一个相机的时候,可以new一个GameObject,然后把Camera组件Add给它就可以了,创建灯光,GUI等也类似,但要创建简单模型的时候,我发现并没有类似Cube,Sphere这样的组件可供添加,后面知道,通过GameObject这个类的一个静态方法可以达到这个目的 static GameObject CreatePrimitiv

Http协议中Cookie详细介绍

Cookie总是保存在客户端中,按在客户端中的存储位置,可分为内存Cookie和硬盘Cookie.内存Cookie由浏览器维护,保存在内存中,浏览器关闭后就消失了,其存在时间是短暂的.硬盘Cookie保存在硬盘里,有一个过期时间,除非... Cookie总是保存在客户端中,按在客户端中的存储位置,可分为内存Cookie和硬盘Cookie.内存Cookie由浏览器维护,保存在内存中,浏览器关闭后就消失了,其存在时间是短暂的.硬盘Cookie保存在硬盘里,有一个过期时间,除非用户手工清理或到了过期时

[转]图解CSS的padding,margin,border属性(详细介绍及举例说明)

图解CSS的padding,margin,border属性 W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层.盒模型主要定义四个区域:内容(content).边框距(padding).边界(border)和边距(margin). 对于初学者,经常会搞不清楚margin,background-color,background-image,padding,content,border之间的层次.关系和相互影响

【转】图解CSS的padding,margin,border属性(详细介绍及举例说明)

W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层.盒模型主要定义四个区域:内容(content).边框距(padding).边界(border)和边距(margin). 对于初学者,经常会搞不清楚margin,background-color,background-image,padding,content,border之间的层次.关系和相互影响.这里提供一张盒模型的3D示意图,希望便于你的理解和记忆.

thinkPHP 模板中的语法知识 详细介绍(十二)

本章节:介绍模板中的语法,详细的语法介绍 一.导入CSS和JS文件    ==>记住常量的是大写 1.css link .js  scr <link rel='stylesheet' type='text/css' href='__PUBLIC__/Css/test.css'/> <script src='__PUBLIC__/Js/test.js'></script> 2.import(==默认是在Public文件夹下) //导入Public文件夹下面的Js目录

HTML5中&lt;template&gt;标签的详细介绍

HTML5中<template>标签的详细介绍(图文) 这篇文章主要介绍了HTML5中的template标签,是HTML5入门中的重要知识,需要的朋友可以参考 一.HTML5 template元素初面 <template>元素,基本上可以确定是2013年才出现的.干嘛用的呢,顾名思意,就是用来声明是“模板元素”. 目前,我们在HTML中嵌入模板HTML,往往是类似这样的写法: 1 2 3 <script type="text/template"> /

[转]详细介绍java中的数据结构

详细介绍java中的数据结构 本文介绍的是java中的数据结构,本文试图通过简单的描述,向读者阐述各个类的作用以及如何正确使用这些类.一起来看本文吧! 也许你已经熟练使用了java.util包里面的各种数据结构,但是我还是要说一说java版数据结构与算法,希望对你有帮助. 线性表,链表,哈希表是常用的数据结构,在进行Java开发时,JDK已经为我们提供了一系列相应的类来实现基本的数据结构.这些类均在java.util包中.本文试图通过简单的描述,向读者阐述各个类的作用以及如何正确使用这些类. C

Linux中的lo回环接口详细介绍

1.linux的网络接口之扫盲 (1)网络接口的命名 这里并不存在一定的命名规范,但网络接口名字的定义一般都是要有意义的.例如: eth0: ethernet的简写,一般用于以太网接口. wifi0:wifi是无线局域网,因此wifi0一般指无线网络接口. ath0: Atheros的简写,一般指Atheros芯片所包含的无线网络接口. lo: local的简写,一般指本地环回接口. (2)网络接口如何工作 网络接口是用来发送和接受数据包的基本设备. 系统中的所有网络接口组成一个链状结构,应用层