【【轻松前端之旅】CSS入门】的更多相关文章

【轻松前端之旅】CSS入门

编写css,很自然的思路: 1.给哪些元素添加样式呢?选择器技术就解决这个问题. 2.添加哪些样式?这就要了解css样式属性及它的值对应的显示规则了. 因此,学习css首先要学的就是选择器,至于样式属性需要靠实践的积累了. CSS选择器,用于选择需要添加样式的元素. 选择器就是一个遍历树的算法.HTML元素以树结构构成HTML文档,选择器遍历树找到符合条件的元素. 选择器的种类(可以理解为按什么条件遍历): 1.元素选择器 如:p {color:red;} 这个样式将应用到页面里的所有p元素.…

【轻松前端之旅】​CSS选择器中的空格与尖括号有何区别？

CSS选择器中的空格与尖括号有何区别? 例子1: .a .b { margin: 0; } 空格隔开a和b,选择所有后代元素. 例子2: .a>.b { margin: 0; } 尖括号隔开a和b,选择所有子元素. 两个例子的区别就在于后代和子,后代包含子子孙孙. [空格符]white space characters 扫码关注就等你了!…

【轻松前端之旅】CSS盒子模型

盒子模型,也叫框模型,在CSS里是很重要的概念. 每个元素都可以看做一个盒子.盒子包含四个部分:外边距(margin).边框(border).内边距(padding).元素内容(element content). 我们知道html元素可以嵌套,所以,元素内容还可以包含其它元素. 盒子模型如下图所示: 注意: 1.height和width属性,指的是元素内容的宽度和高度!元素的总宽度=width+padding+border+margin! 2.background背景属性,应用到元素内容.内边距…

【轻松前端之旅】<!DOCTYPE>标签

前端学习,先学习HTML,CSS,Javascript HTML - HyperText Markup Language HTML-超文本标记语言,提供了一种标记网页内容的方法. 浏览器怎么知道如何显示一个页面呢?因为HTML告诉浏览器页面内容的结构. 浏览器将翻译HTML中的所有标记(尖括号括起来的,如<div>). 不同的标记代表不同的含义.如,<img>代表图片.<p>代表段落. 今天开始学习HTML标签. 标签:<!DOCTYPE> 所有浏览器都支持…

前端开发HTML&CSS入门——具体是做什么的

软件开发,一提起来感觉这个感觉这个词范围很大很广,说起来也很笼统.不知所云,开发的到底是什么?或者说开发的具体内容是什么?以前我们讲软件开发主要是分前端和后端,那前端和后端又是什么那?你可以这么通俗的理解,前端就是用户可以看到的界面,而后端就是客户看不到的模块.现在我们已经摒弃了这种说法,因为这种说法太过笼统,太过局限性.所以我们现在将软件开发分为B/S和C/S. 首先我们先讲讲什么是C/S.C/S (Client/Server,客户机/服务器)模式又称C/S结构,是软件系统体系结构的一种.C/…

【轻松前端之旅】HTML的块元素、行内元素和空元素

块(block)元素 显示成一块,前后有换行.块元素常用于web页面的主要构造模块.例如:<div>,<p>,<h1>~<h6>,<blockquote> 行内(inline)元素(内联元素) 显示在行内,内容与父元素内容在一行.内联元素通常用来标记小段内容.例如:<q>,<em> 空(void)元素 没有内容,用一个开始标签即可.如:<br>,<img> 实体字符(character entity…

【轻松前端之旅】元素，标记，属性，<html>标签

HTML文档是由HTML元素定义的. HTML元素(element)指的是从开始标签(start tag)到结束标签(end tag)的所有代码. 有些元素会使用简写记法,如<img src='test.png'>  ,没有结束标记. 在css中,我们通过选择器来选择元素,并定义其样式. 在javascript中,我们通过document.getElementBy...方法来获取元素,动态操作元素的属性和结构. 元素 = 开始标记+内容+结束标记 属性(attribute)为HTML元素提供附…

前端开发之CSS入门篇

一.CSS介绍和语法 二.CSS引入方式 三.基本选择器 四.高级选择器 五.伪类选择器 六.伪元素选择器 1️⃣  CSS介绍和语法 1. CSS的介绍 (1)为什么需要CSS? 使用css的目的就是让网页具有美观一致的页面,另外一个最重要的原因是内容与格式分离 在没有CSS之前,我们想要修改HTML元素的样式需要为每个HTML元素单独定义样式属性,当HTML内容非常多时,就会定义很多重复的样式属性,并且修改的时候需要逐个修改,费心费力.而此时CSS就出现了. CSS的出现解决了以下问题: 首…

前端学习笔记--CSS入门

1.css概述: 2.css语法: 3.css添加方法: 用单独的文件存储css样式的优点: 优先级: h3得到的样式是内嵌样式覆盖了外部样式. 4.css选择器 标签选择器: 类别选择器: ID选择器: 嵌套标签: 集体标签: 全局声明: 混合引用:…

前端开发HTML&css入门——伪类选择器和一些特殊的选择器

伪类和伪元素 有时候,你需要选择本身没有标签,但是仍然易于识别的网页部位,比如段落首行或鼠标滑过的连接.CSS为他们提供一些选择器:伪类和伪元素. 常用的一些伪类选择器: :link :visited :hover :active 表示普通的链接(没访问过的链接) 表示访问过的链接 浏览器是通过历史记录来判断一个链接是否访问过, *由于涉及到用户的隐私问题,所以使用visited伪类只能设置字体的颜色 表示鼠标移入的状态 超链接被点击的状态 <!DOCTYPE html> <html&g…