CSS
关注
分享
扫一扫
溺水的鱼儿(*^_^*)
闲来无事，方也学学；兴趣盎然，便也写写。
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
CSS元素哪些可自动换行，设置宽高？& CSS元素参照问题
本文主要说明CSS的元素哪些可以自动换行且可以设置宽高？以及CSS元素的参照问题。一、元素换行和宽高设置总结1.常见的块级元素（可自动换行、设置宽高）？ div h1~h6 p pre ul ol li form table lable hr tr th td 等。2...原创 2020-07-06 11:52:22 · 663 阅读 · 0 评论 -
CSS如何实现垂直居中
我们在CSS布局中，经常遇到子元素无法垂直居中的情况。今天我们就来看一下几种实现子元素内容垂直居中的方法：1.vertical-align 。该属性可以设置元素的垂直居中，但是该属性是应用于内联元素和display:table-cell的元素。所以，我们可以将父元素设置为display:table，再把子元素设置为display:table-cell。partent{ display:table;}child{ display:table-cell; vertica.原创 2020-07-01 10:57:35 · 288 阅读 · 0 评论 -
HTML+CSS+JS实现简单计算器
本文运用前端代码实现一个简单的计算器界面，并实现了基本的（加、减、乘、除、清屏/退格、取余、取倒）功能。1.编写前端界面<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>我的计算器</title> <style> .containor{ border:...原创 2020-06-22 11:13:58 · 1590 阅读 · 1 评论 -
css 优先级顺序
!important > id > class > tag!important 属性顾虑器 权重高于内联样式；.testClass{ color:red !important; } 注：!important在IE6中是不被识别的。ID选择器，权值为0100；<head> #name{ color:red; }</head><body> <d...原创 2020-06-18 10:46:29 · 408 阅读 · 0 评论 -
html代码实现简单的简历模板
用前端代码编写一个简单的简历模板 完整代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Biographical Notes</title> <style> /*div{*/ /* border:1px solid red;*/ /*...原创 2020-06-11 20:26:28 · 9132 阅读 · 0 评论 -
如何在网页标题前添加图标
在前端中，我们为了页面的美化有时需要给标题前面添加图标。今天，我们来看一下如何添加：首先，先看一下只添加标题的结果<!DOCTYPE html><html><head> <title>百度一下，你就知道</title></head><body></body></html>结果如下（前边为默认图标）： 如何添加图标？添加<link...原创 2020-06-11 09:46:50 · 1480 阅读 · 1 评论 -
页面导入样式文件的四种方式 & link 和 @import 的区别
导入样式文件的四种方式内嵌样式（style=""） 内部样式表（页面<head>区里放置样式表） 链入外部样式表（引用样式表文件） 导入外部样式表（用@import ,在<head>与</head>之间）link与@impoort的区别link属于html标签，而@import是CSS提供的。link除了加载CSS外，还能用于定义RSS，定义rel链接属性等作用；而@import是CSS提供的，只能用于加载CSS。 import是CSS2.1提出的.原创 2020-06-09 09:46:57 · 988 阅读 · 0 评论 -
CSS定位（position 的用法）
Position定位 position属性指定了元素的定位类型。具有五个属性值：position:static; position:fixed; position:absolute; position:relative; position:sticky; position:static; 静态定位，html的默认值，不会受到left、 right 、top、bottom的影响。 <style> body{ he...原创 2020-06-06 22:22:03 · 623 阅读 · 1 评论 -
CSS组合选择符、伪类伪元素
CSS组合选择符后代选择器(以空格分隔) 子元素选择器(以大于号分隔） 相邻兄弟选择器（以加号分隔） 普通兄弟选择器（以破折号分隔） 后代选择器(以空格分隔) ：选取某元素的后代元素 <!DOCTYPE html><html><head><meta charset="utf-8"><title>CSS组合选择符</title><style> div p{ font-size:100px原创 2020-06-04 09:29:59 · 367 阅读 · 0 评论 -
html中元素的显示优先级
显示优先级其实就是哪个元素显示在上面，哪个显示在下面！！！1.帧元素、表单元素、非表单元素 在html中，HTML中的元素一般划分为帧元素、表单元素、非表单元素。帧元素（frameset）的优先级最高，表单元素比非表单元素的优先级要高。 优先级：帧元素（frameset）>表单元素 >非表单元素 表单元素包括：文本输入框，密码输入框，单选框，复选框，文本输入域，列表框等等； 非表单元素包括：a，div, table, span等。...原创 2020-06-03 14:45:03 · 2754 阅读 · 0 评论 -
CSS hack的三种常见形式
CSS hack技术的简介 不同浏览器在混杂模式下的行为差异非常大，如果不使用某些hack技术，跨浏览器的行为就没有一致性可言。hack技术主要就是为了某些浏览器特定设置的。针对不同的浏览器写不同的CSScode的过程，就叫CSS hack。写在CSS中，里边可以嵌套style和html代码；不可以写在style中。混杂模式：HTML Doctype如果文档开始没有发现文档类型声明或者声明错误，则所有的浏览器会默认开启混杂模式。CSS Hack常见的有三种形式：CSS属性H...原创 2020-06-03 09:44:13 · 716 阅读 · 0 评论 -
CSS的三种样式应用
css在html中的应用方式内联样式：在html元素中使用style属性； <h1 class="myh1" style="background-color: hotpink; font-family: 宋体;color: indigo;font-size: 100px;text-align: center;">你是精致的猪猪女孩</h1> 内联样式表：在<head>中使用<style>定义css样式； <head> .原创 2020-05-31 19:49:08 · 462 阅读 · 0 评论