CSS与html
请叫我二狗哥
我目前主要内容搬迁到博客园,CSDN偶尔逛逛。我的博客园网址https://www.cnblogs.com/f6056/
展开
-
CSS如何实现一个任意倒三角
绘制倒三角形,已知它的三边长分别为240px、150px、200px,请给出CSS代码。这里仅仅针对CSS实现任意倒三角形的具体案例做相关代码。CSS实现三角形的原理我在。倒三角(1)CSS代码。倒三角(2)CSS代码。倒三角(3)CSS代码。倒三角(4)CSS代码。倒三角(5)CSS代码。倒三角(6)CSS代码。/* 补充代码 */原创 2022-11-09 18:30:00 · 1697 阅读 · 0 评论 -
网站在百度站长平台无上传站点LOGO权限下,如何实现LOGO图片在百度索引中自动抓取展现?
最近美萌那边的大妹子找到我们部门要求解决网站LOGO显示错误的问题。领导将这个问题指派到我这里。我一看这个LOGO图片应该是百度自动抓取首页的一张图,该如何解决这个问题呢?百度搜索引擎对于网站LOGO有2种策略:(1)针对百度认为的优质/权威性站点进行不定期的自动挖掘展现/更新站点LOGO;(2)根据百度搜索资源平台后台中[站点LOGO]权益进行提交。前者为百度根据自身内部的站点评级系统进行自动判定,若认为网站通过判定,即自动挖掘网站中最可能适合网站的LOGO图片进行展示,后者为提交网站百度站长验证代码后,原创 2022-06-23 22:45:00 · 1016 阅读 · 0 评论 -
1-4 编程练习根据如下效果图编写代码
<!DOCTYPE HTML><html lang="zh-CN"><head><meta http-equiv=Content-Type content="text/html;charset=utf-8"></head><body> <form> <!-- 此处填写代码 --> </form></body></html>...原创 2022-03-02 14:02:07 · 977 阅读 · 0 评论 -
通过数学建模前端绘制澳门特别行政区区旗
根据《GB 17654-1999 澳门特别行政区区旗》,对相关数据综合,采用国标GB 17654-1999标准中的5号尺寸数据,保留4位小数。 <!DOCTYPE html><html><head lang="zh-CN"> <meta charset="UTF-8"> <title>澳门特别行政区区旗svg图形</title> <style type="text/css">原创 2021-01-14 18:14:43 · 846 阅读 · 0 评论 -
数学建模用前端CSS绘制香港特别行政区区旗
通过CSS绘制香港特别行政区区旗,初始设计旗帜宽为960px,高640px。 <div class='flag'> <div class='c1'> <div class='c2'> </div> <div class='e'> </div> <div class='q'> </div>原创 2020-12-25 12:37:53 · 1198 阅读 · 1 评论 -
圣杯布局和双飞翼布局的原理探究
浮动布局并不是再是流行的布局方式,不过基于浮动的经典布局还是经常出现在前端面试中,圣杯布局和双飞翼布局就是其中常考核的知识点。圣杯布局和双飞翼布局都是前端中三列设计布局方式,要求主要中间内容优先渲染,左右内容宽度固定,中间主要内容宽度自适应排布。圣杯布局和双飞翼布局都没有使用绝对定位,而是应用浮动、负外边距以及相对定位这几个核心知识点来实现。圣杯布局圣杯布局是让左右固定栏和中间自适应的主内容栏处于同一容器包裹中,容器(#container)设置padding-left、padding-right值,其原创 2020-11-25 09:43:50 · 2166 阅读 · 0 评论 -
基本表格的创建编程练习(2020-8-6)
(2020年8月6日) 编程练习 编程练习:请编写一段代码,实现边框为1,三行两列的表格。 效果图如下: 任务 1.创建一个三行两列的表格 2.设置表格边框值为为框设置1 3.根据效果图在相应单元格内添加相应文字参考代码: <table border='1'> <tr> <td>周六</td> <td>周日</td>原创 2020-08-06 12:39:27 · 1148 阅读 · 0 评论 -
columns多列1-6编程练习
columns多列1-6编程练习综合所学知识,设置一段文字分成两列。效果图如下:任务(1)多列盒子宽度为400px;有5像素的边框;(2)标题14号字体、加粗、居中显示,有背景颜色:如果不(255,192,203);(3)将文字分成两列,每列列宽为140px,正文文字12号字体、两端对齐显示。<!DOCTYPE html><html>...原创 2019-10-11 12:39:29 · 283 阅读 · 0 评论 -
CSDN博客去除图片水印而不影响图片自适应的方法
CSDN博客在上传图片过程中,会自动给图片加盖水印。这种方式虽然在一定程度上保护了创作者的知识产权,但是其强制性也让很多人不舒服。有同学方法是在上传过程中,在URL中取出掉问号之后的内容,即?x-oss-process=……的内容,如下示例:https://img-blog.csdnimg.cn/20190725134930187.jpg?x-oss-process=image/waterma...原创 2019-07-25 13:30:17 · 421 阅读 · 0 评论 -
background-color、background-image、background-attachment、background-position等属性详解
background-color背景颜色background-color背景颜色是包含边框border,边框如果不设置颜色,默认会采用文本颜色,而文本颜色默认是黑色。background-image背景图片background-image背景图片占据了元素的全部尺寸,包括内边距padding和边框border,但不包括外边距margin。默认背景图片位于元素的左上角,并且在水平和垂直方...原创 2019-04-09 21:49:57 · 2377 阅读 · 0 评论 -
HTML块级元素和行内元素的嵌套规则
HTML块级元素和行内元素的嵌套规则:(1)除P标签外的块级标签可以嵌套块级元素和行内元素。(2)P标签不能嵌套块级元素,只能嵌套行内元素。(3)行内元素只能嵌套行内元素。...原创 2019-03-28 22:47:21 · 1513 阅读 · 1 评论 -
表单form标签的属性、值以及描述
属性 值 描述 action URL 提交表单时,向何处发送表单数据 method get、post 设置表单以何种方式发送到表单页面 name form_name 表单的名称 target _blank、_self _parent、_top 在何处打开action URL enctype ...原创 2019-03-28 22:36:46 · 4230 阅读 · 0 评论 -
前端开发中CSS常用的样式命名
CSS开发过程中class和id命名需要遵循一定的规则,令其具有可读性,提高阅读效率,一般采用驼峰命名法。CSS常用的样式命名:(1)页面结构页头:header页面主体:main页尾:footer内容:content/container容器:container导航:nav侧栏:sidebar栏目:column页面外围控制:wrapper左右中:lef...原创 2019-04-02 00:00:33 · 433 阅读 · 1 评论 -
CSS选择器优先级的权值与计算
选择器权值标签选择器:权值为1类选择器和伪类:权值为10ID选择器:权值为100通配符选择器:权值为0行内样式:权值为1000当权值相同时,遵循就近原则。实验案例:<p>派生选择器优先级</p> <div id="test1"> <h1>CSS样式优先级</h1> <p id="test2"&...原创 2019-04-01 22:20:25 · 1037 阅读 · 0 评论 -
HTML中清除浮动的几种方法
清除float的常见几种方式:清除浮动方法(1)在浮动元素后面使用一个空的自身清除浮动的元素。例如<div style="clear:both;"></div>实例:清除容器中子元素的浮动,让父元素塌陷的高度恢复。 <div class="content"> <div class="div1 son">&...原创 2019-04-10 22:53:14 · 22641 阅读 · 1 评论 -
制作一个简单的文章列表页面样式
仿制了一个简单的文章列表页面样式<!doctype html><html><head><meta charset="utf-8"><style>*{ margin:0; padding:0; font-family:宋体; }div{ width:50%; height:250px; border:1px s...原创 2018-04-20 17:39:36 · 6646 阅读 · 0 评论 -
CSS样式中class、id命名常用英文收集整理
CSS样式中class、id命名常用英文收集整理Cchannel【ˈtʃænəl】n.频道,栏目Ffromat美[ˈfɔːrmæt] n.格式,(出版物的)版式原创 2018-09-13 15:03:02 · 320 阅读 · 0 评论 -
优质前端基础知识网站收集整理
JavaScript基础知识网站:W3C官网(英语):http://w3.org/TR/css-backgrounds网道https://wangdoc.com/javascript/W3C中ECMAScrit标准中文翻译https://www.w3.org/html/ig/zh/wiki/ES5/%E6%A6%82%E8%BF%B0#.E8.AF.AD.E8.A8.80....原创 2018-09-13 16:23:35 · 437 阅读 · 0 评论 -
如何查看浏览器的元素默认样式?
FireFox浏览器的默认元素样式查询方式:resource://gre-resources/html.css笨办法:通过Dreamweaver编辑一段HTML代码,在其中加入需要查询的元素代码,元素无任何样式。在需要查询的浏览器中打开,通过调制器中查看该元素计算样式,选择展示所有元素样式即可。...原创 2018-09-21 15:54:07 · 1410 阅读 · 0 评论 -
前端HTML表格标签缩写含义以及表格属性值简介
前端HTML表格标签缩写含义:标签 英文含义 中文翻译 tr table row 表格行 td table data cell 表格数据单元格 th table head cell 表头单元格 前端HTML表格属性简介前端HTML表格属性简介 属性 值 描述 width pixels、% 规定表...原创 2019-03-25 12:44:17 · 1081 阅读 · 0 评论 -
HTML中<table>标签的frame、rules属性的值以及其描述内容
HTML中<table>标签的frame属性的值以及其描述内容:属性 值 描述 frame void 不显示外侧边框 above 显示上部的外侧边框 below 显示下部的外侧边框 hsides 显示上部和下部的外侧边框 vsides 显示左边和右边的外侧边框 lhs 显示左边的外侧边框 rhs ...原创 2019-03-25 17:15:03 · 1478 阅读 · 3 评论 -
input标签type属性值以及相关描述
input标签的type属性值以及相关描述input标签的type属性值以及相关描述 type属性 描述 text 文本域 password 密码域 file 文件域 checkbox 复选域 radio 单选域 buttom 按钮 submit 提交按钮 reset 重置按钮 hidden ...原创 2019-03-26 22:59:13 · 4568 阅读 · 0 评论 -
input标签单行文本域type="text"的可以添加属性以及其描述
input标签单行文本域type="text"中可以添加的属性以及其描述 属性 描述 name 文本域的名称 maxlength 用户输入的最大字符长度 size 指定文本框的宽度,以字符个数为单位;文本框的缺省宽度是20个字符。 ...原创 2019-03-26 23:13:20 · 8191 阅读 · 0 评论 -
css外部导入样式的三种书写方式
CSS的外部导入样式书写方式:(1)采用url的形式导入:<style type="text/css">@import url("styleurl.css");</style>采用url与()结合的方式也可以省略掉引号。下面的写法也是正确的:<style type="text/css">@import url(styleurl.css)...原创 2019-03-31 12:14:27 · 5650 阅读 · 2 评论 -
a标签链接伪类:link、:visited、:hover、:active的排列顺序
链接伪类要想所有伪类均起效果,需要按照一定顺序进行排列::link>:visited>:hover>:active1、a:hover必须置于a:link和a:visited之后才有效。2、a:active必须置于a:hover之后才有效。3、伪类名称对大小写不敏感。<!DOCTYPE html><html><head lan...原创 2019-04-01 12:27:40 · 2224 阅读 · 0 评论 -
标签选择器与类选择器中间是否应该有空格?他们之间的区别有哪些
标签选择器和类选择器是CSS中最常用的组合选择器类型,很多时候标签选择器与类选择器之间存在空格,有些时候两者之间又不存在空格,是否存在空格有什么区别呢?以下面代码为例:<p class="red"> 1 <a href="http://blog.csdn.net/weimob258616" target="_blank">弹幕猴子</a> ...原创 2019-04-01 13:04:01 · 1733 阅读 · 0 评论 -
CSS半透明边框效果
源代码:<!doctype html><html><head><meta charset="utf-8"><style>div{ width:500px; height:309px; border:50px solid hsla(0,0%,100%,0.5); background:url(file:///C:/Use...原创 2018-04-20 10:25:24 · 2745 阅读 · 0 评论