花了一段时间看css把这个新blog个性化了一番——还好这里和csdn用的是一个blog系统,省了不少事情。

CSS 弹性盒布局:flex-wrap 换行与多行交叉轴对齐 默认情况下,弹性容器(flex container)会把所有子项(flex item)挤在一行里,哪怕空间不够也只会压缩子项,而不会换行。浏览器会依次把子项放进当前行,当剩余空间不足以容纳下一个子项的基础尺寸时,就开启新的一行。一旦允许换行,容器里就会出现多条「弹性行(flex line)」,此时交叉轴对齐的行为也会从「单行对齐」变成「多行对齐」,是默认值:当子项没有设置固定高度时,行会被拉伸,子项随之变高,看起来像是「撑满了容器」。上面这段代码中,每个子项固定 200px 宽,容器宽度决定每行能放几个。 阅读详情
 这里写的是我在yesky上的blog(已弃用)的个性化设置心得,能量有限,仅仅是找了一晚上资料的结果,还请不要见笑。

现改到这个样子,看起来还挺合心意,以后准备事情况在作定夺,可能会加上背景换一个title的图片,然后加上一个可用的计数器和google,也有可能加入google的广告——这里可以插入代码真是很不错的,给人积极性亚——要是能提供“相片册”,支持连接外部图片,然后上传图片中提供对swf文件的支持就更好了。

在页面中可以打开源文件,这样就可以看到所调用的css文件的地址了。从系统中调用的默认css文件在这里:blog.yesky.com/Blog/Skins/Cogitation/style.css;然后在管理/选项/设置/定制CSS选择器中输入要更改的css属性框,这样系统会用自定义的属性框覆盖默认的,已完成个性化。个性化的css部分在这里:blog.yesky.com/Blog/用户名/customcss.aspx,用文本编辑器打开就可以了,当然专用软件更好。

我用的是Cogitation样式,这里对这个文件进行以下注解——我也是现买现用,因为以后可能还用的着,不想自己刚才的3个小时白白浪费掉,所以这里简单注解一下。

........发现“插入代码”功能不好用——或者我还不会用——也没有help。。。。。空欢喜了。。。。。

//body值得可能是主体内容吧——不确定
body {
 font-size : 12px;
 font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
 margin : 0px;
 word-break:break-all;
}
//——不确定

td
{
 font-size : 12px;
 font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
}
//指的是超连接文字相关的属性。

a:visited,
a:active,
a:link { 
 color: Navy;
 text-decoration : none;
}

a:hover {
 text-decoration : underline;
}
//h1,h2,h3,h4,h5号字号的定义,和这些字号的超链接效果定义。

h1 {
 margin : 0px;
 margin-top : 10px;
 margin-bottom : 5px;
 font-size : 18px;
}

h1 a:visited,
h1 a:active,
h1 a:link {
 color : #000;
}

h1 a:hover {
 color : #47F;
 text-decoration : none;
}

h2 {
 margin-top : 10px;
 margin-bottom : 3px;
 font-size : 13px;
}

h3 {
 font-size : 12px;
}

h5 {
 margin: 0px;
 padding: 0px;
}
//——不确定是什么文字的定义

p {
 margin: 10px 0px;
}
页面底部版权的定义

#authors ul {
 list-style : none;
 padding : 0px;
 margin : 0px 5px;
}
//左边news项的定义

div.News
{
 font-size: 11px;
 font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
 padding: 5px;
 padding-left: 10px;
}
——顶上的一个东西,还不知道具体指哪

.HeaderTitle
{
 font-size : 1.5em;
 margin: 0px;
}
//指的是“龙龙眯起来”的定义

.HeaderTitles
{
 padding-top: 10px;
 padding-left: 10px;
 padding-right: 10px;
 padding-bottom: 10px;
 width: 100%;
}

.HeaderTitles a:visited,
.HeaderTitles a:active,
.HeaderTitles a:link,
.HeaderTitles a:hover
{
 color: White;
 text-decoration : none;
 font-size: 18px;
 font-weight: normal;
}
//应该是顶部的那个聚合,管理什么的部分

.HeaderBar
{
 font-weight: normal;
 font-size: 11px;
 border-collapse: collapse;
 background-image: url(images/BlueTabBack.gif);
   background-repeat:repeat-x;
}

.HeaderBar a:visited,
.HeaderBar a:active,
.HeaderBar a:link
{
 color: WhiteSmoke;
 text-decoration: none;
 font-weight: normal;
}
——不明

.HeaderBarTab
{
 background-image: url(images/BlueTabFace.gif);
   background-repeat:repeat-x;
   border-collapse: collapse;
   padding: 0px;
}
//就是顶上的那个统计,右边那个

.BlogStatsBar
{
 text-align:right;
 font-weight: normal;
 font-size: 11px;
 color: Silver;
 border-collapse:collapse;
}
//日期,每个post下边那个吧

p.date img {
 vertical-align : middle;
}

p.date {
 font-size : 11px;
 font-weight : bold;
 margin-bottom : 0px;
 padding-top: 2px;
 padding-right: 0px;
 padding-bottom: 4px;
 text-align: right;
}
——不明

blockquote {
 font-style : italic;
}
//顾名思义,每个post的题目链接

div.postTitle a:visited,
div.postTitle a:active,
div.postTitle a:link
{
 color: Navy;
 text-decoration : none;
}
//每个post框的样式

div.post
{
 border-right: gainsboro 2px solid;
 border-top: gainsboro 2px solid;
 border-left: gainsboro 2px solid;
 border-bottom: gainsboro 2px solid;
}
//post题目的样式

div.postTitle
{
 padding-left: 3px;
 font-weight: bolder;
 font-size: 13px;
 padding-bottom: 3px;
 padding-top: 3px;
 border-bottom: gainsboro 1px solid;
 background-color: whitesmoke;
}
//
每个文章和回复的内容文字属性

div.postText
{
 padding-right: 10px;
 padding-left: 3px;
 font-size: 13px;
 padding-bottom: 5px;
 padding-top: 10px;
}
//post底部那个小框的样式

div.postFoot
{
 background-color: WhiteSmoke;
 border-top: gainsboro 1px solid;
 font-size: 11px;
 padding-right: 3px;
 padding-left: 3px;
 padding-bottom: 1px;
 padding-top: 1px;
 text-align: right;
}
//顶上的样式,那个深蓝色图片的样式

#top
{
 background-image: url(images/BlueTabBackground.gif);
   background-repeat: repeat;
 color : WhiteSmoke;
 border-top : 4px solid Black;
 border-bottom : 4px solid Black;
 padding: 0px;
 margin: 0px;
}
//应该是管理呀什么的中间那些分界线——不确定

#tagline {
 font-size : 16px;
 margin : 0px;
 color: White;
}
//左边的菜单和相应的h,链接的定义

#leftmenu {
 position : absolute;
 left : 0px;
 width : 180px;
 height:auto;
 background-color: WhiteSmoke;
 padding-top: 0px;
}

#leftmenu h3 {
 font-size : 11px;
 margin : 0px;
 margin-top : 10px;  
 padding-bottom: 2px;
 padding-left: 3px;
 border-top: solid 1px Gainsboro;
}

#leftmenu ul {
 list-style: none;
 margin : 0px;
 padding-left : 5px;
 margin-left : 5px;
 margin-bottom : 10px;
 font-size : 11px;
}

#leftmenu a
{
 padding: 1px;
 text-decoration: none;
}

#leftmenu a:active,
#leftmenu a:visited,
#leftmenu a:link
{}

#leftmenu a:hover
{
 font-style:italic;
}
//右边主体的定义

#main {
 margin-left : 180px; 
 background-color : White;
 padding : 10px;
 border-left : 1px solid #555;
 border-bottom : 4px solid Black;
}

#footer {
 margin : 0px; 
 padding-top : 5px;
 text-align : center;
 font-size : 10px;
}
//回复框的定义

#CommentForm
{
 font-size : 11px;
 font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
}

input, textarea
{
 font-size: 11px;
 font-family : Verdana, Geneva, Arial, Helvetica, sans-serif; 
}

.CommentForm
{
 font-size : 11px;
 font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
}

.Button
{
 border: 1px solid SteelBlue;
 background-color: gainsboro;
}
//那个日历的定义

.Cal
{
 border : 1px solid #186AA2;
 width:100%;
 font-family:Arial;
 font-size: 12px;
 margin-top:0px;
 margin-bottom:10px;
 height:180px;
 background-color:WhiteSmoke;
 padding : 0px;
   
}

.CalTitle
{
 background-color : #014E82;
 border-color:#ADF;
 font-family:Arial;
 font-size: 13px;
 font-weight:normal;
 color : #000; 
 margin-left : 0px;
 padding : 0px;
 height:100%;
  
}


.CalOtherMonthDay
{
 color:#808080;
 
}

.CalSelector
{
 
}

.CalNextPrev
{
 
}

.CalDayHeader
{
 background-color:#186AA2;
 color : #000; 
 
}

.CalSelectedDay
{
 
}

.CalWeekendDay
{
 
}

.CalTodayDay
{
 /*background-color:#93C49C;*/
 color:Red;
}


通过google可以找到许多关于css的教程,我看得是这里的:http://www.hongen.com/pc/homepage/css/css0101.htm
这里主要用到的就是css的属性这方面的内容,因为只有知道了每个“:”后便都可以填什么,才可以进行自定义——用专用编辑器的就不要说了,呵呵。自然,你还可以用一些高级内容,作更玄的效果——见识过一些这方面的高手是如何牛叉的。。。。。

关于天气预报(我也还有些用不好),计数器,搜索,在网上,google上,可以找到好多内容。因为csdn和这里的用的是同一个Blog系统,而且启动较早,又是编程高手群居的地方(呵呵,也只能这么想了),所以,建议在google搜索的时候使用site:csdn.com来搜,会方便一些,那里有一些人已经总结了好多blog个性化定义的方法,呵呵。

Q :能告知天气预报怎么做的嘛?
A:<br>
<b>&nbsp今日天气</b>
<br>
<center>
<iframe width=157 height=240 frameborder=0 scrolling=NO src='http://appnews.qq.com/cgi-bin/news_qq_search?city='></iframe>
</center>
<br>


代码如上。本来还可以做到直接显示你所在的城市的,但是需要做换一下城市代码,这个我还不会,也不知道城市代码,所以知识默认的深圳。


YOLO系列专栏(十二):YOLO26行业落地实战(三):无人机航拍场景——户外巡检(机载边缘计算+YOLO26) 无人机航拍巡检场景,面临机载设备算力/显存有限、高空航拍目标小、户外环境复杂(风力、光线变化)、图像抖动等问题,对模型的轻量化、实时性、小目标检测能力要求极高。YOLO26相比传统模型,在该场景中具备三大核心优势:✅ 极致轻量化:INT8量化+模型剪枝后,模型体积可压缩至5MB以内,显存占用控制在512MB以内,适配Jetson Xavier NX等机载边缘计算设备;✅ 小目标检测能力强:优化检测头与锚框配置,可精准识别高空航拍中的小尺寸目标(如线路断股、绝缘子裂纹),检测准确率高; 阅读详情

相关推荐

某手sig3-ios算法 Chomper黑盒调用

本文主要是介绍Chomper的算法模拟执行,Chomper目前已经已经是能比较完整的模拟ios可执行文件执行的模拟器,在这块有非常大的优势。以前安卓端有强势的unidbg,现在iOS也有Chomper了,后续等待作者持续更新,完善Chomper。强势推荐一波-> Chomper地址: https://github.com/sledgeh4w/chomper。我这块也已经使用Chomper完成雅迪系列、某手的算法调用。后续也会有更多扩展。

成小新的博客 2156

【HTML5】弹性盒子实现导航栏和留言框

本期讲解:display设置元素生成框,柔性盒子flex-grow属性 、flex-shrink 属性、flex-basis属性 、flex-direction属性,以及列表的用法,最后实现简易的导航栏和留言框。

我的主页 4660

果蔬及菜品识别系统

果蔬及菜品识别系统

我的博客 2120

脸皮厚之偷看别人的博客园设计样式

  之前闲着的时候,想着弄一下博客园的样式,尝试了一些,就把学到的,记录一下。   一、查看别人博客园的样式:(以自己为例),按F12可以看到,这个blog/customcss就是我的CSS样式      在自己博客园的 管理-设置 里可以看到这个页面定制CSS代码,这个就是上面那个   二、查看别人的皮肤(好像用CSS都有对应皮肤),那个ThinkInside就是我用的皮肤...

weixin_30273175的博客 385

Altium Designer 21 DRC检查:从新手到高手,这10个常见错误你踩过几个?

本文详细解析Altium Designer 21 DRC检查中的10个高频错误,包括间距违规、线宽违规、未连接网络等常见问题,并提供精准修复方案和实战技巧。通过分层诊断、智能规则设置和三维排查等方法,帮助工程师从新手进阶为高手,提升PCB设计效率和质量。

weixin_26873711的博客 222

python解析通达信dat与blk数据文件【附源码】

本文介绍了一个完整的通达信金融数据解析器项目,该项目攻克了通达信专有二进制文件格式解析的技术难题。项目采用模块化架构,从基础二进制解析到增强数据分类,最终实现智能语义化列名生成,形成完整的数据处理链路。核心技术包括自适应编码检测、智能数据类型推断和基于业务规则的语义化处理,解决了逆向工程、多编码兼容性等挑战。项目成果显著,解析成功率达100%,数据可读性大幅提升,开发效率提高50%,为量化交易、可视化分析等场景提供了可靠数据支持。该方案不仅具备技术创新性,更具有实际工程应用价值,为金融数据分析领域提供了可复

qq_36224726的博客 2689

BLOG风格美化之 偷别人的CSS

     看到别人漂亮的blog,再看看自己的原版风格blog,是不是觉得很眼馋呢,但是又不是每个人都精通CSS.比如我 .也总不能为了美化BLOG再去抱一本CSS实用大全来看吧. 今天看过了老白的风格美化文章,也学会了偷别人的CSS!    你要知道的是,每个Blog的页面显示,由两个主要的CSS文件控制。     第一个,就是你在后台选项设置中选择的皮肤;第二个就是你在后台选项页签“自定义

李德成的网志 × lidecheng's WeBlog 911

HFSS实战项目——Ku波段微带发夹线滤波器

保姆级教程!!!看完必会,非常详细!!!Ku频段5阶切比雪夫微带线带通滤波器的仿真实例。首先介绍了滤波器的技术指标和基本理论知识,重点介绍了滤波器的耦合系数和外部品质因数。建立了谐振器的设计模型、耦合系数与谐振器间距的设计模型、外部品质因数与抽头位置的设计模型和滤波器整体电路的模型。详细介绍了谐振器设计模型的建立步骤。

2401_87464239的博客 3042

CSS:background-color

ActiveBorder<br />ActiveCaption<br />ActiveCaptionText<br />AppWorkspace<br />Control<br />ControlDark<br />ControlDarkDark<br />ControlLight<br />ControlLightLight<br />ControlText<br />Desktop<br />GrayText<br />Highlight<br />HighlightText<br />HotTrack

摄氏0℃の水的专栏 1534

GB28181 —— 3、C++编写GB28181设备端,完成注册、注销、保活心跳、响应查询目录等功能(附源码)

GB28181 —— Win10下编写GB28181设备端,完成注册、注销、保活心跳、响应查询目录等功能(附源码)

1308

RDkit入门

今天开始写RDkit的入门教程,每天学习和写一小点,相信一句话“不积跬步无以至千里,不积小流无以成江海”,所以就慢慢来,一点一滴积累叭,从最简单的开始喽希望自己每天都能保持写博客的好习惯,把自己的代码笔记就极在这里,RDkit一块啃了很久的骨头,今天终于要下定决心,好好总结一波了,希望保持这个更新的频率,每天都能有所学。............

博客而已 6683

Chrome自定义CSS样式的方法

Chrome自V33以后不允许自定义CSS样式了,但是仍然可以通过插件的方式实现自定义样式。因此本文主要完成如下3个工作: 1,介绍ChromeV33+自定义CSS样式的方法 2,介绍Chrome自定义滚动条样式的代码 3,介绍Chrome插件添加白名单的方法

子宽的专栏 1万+

泰山派rk3566 audio音频基础介绍

本文介绍了嵌入式系统中音频处理的基础知识,重点围绕RK3566平台的音频子系统展开。文章首先解释了音频信号从模拟到数字的转换过程,包括采样率、位深和声道等核心概念。随后详细分析了嵌入式音频开发中的关键接口:I2C用于控制音频编解码器,I2S作为专用音频数据传输总线,以及PCM作为原始音频格式和ALSA设备抽象的双重含义。通过对这些基础概念和接口的解析,为在RK3566平台上进行音频驱动开发和应用调试提供了理论基础。

qq_37077309的博客 294

优快云 Blog使用方法汇总

优快云Blog使用方法(非官方,持续更新)(已更新二次) http://blog.csdn.net/upwaker/archive/2004/06/25/26866.aspx内容:记得看过一篇问Blog怎么用的文章,我也是新手,不过经过摸索我找到了一些使用方法,特介绍给大家,大家不要笑话我写的浅啊,新手嘛.1.写文章,建立相册之前都先要编辑分类,写好文章后选择自己的文章的分类.2.至于文档中心的

高血压的熊 http://blog.youkuaiyun.com/foreverkissing 2971

IMSL CNL 7.0.0 (x86-64)Crack

IMSL CNL 7.0.0 (x86-64)Crack intel的算法库破解文件,这是C++版本的破解文件

Camera2Demo

在Camera2 的基础上进行封装,使得Camera2一堆初始化逻辑与Activity分离,降低耦合度,完成预览拍照并保存的操作

优快云Blog使用方法(非官方,持续更新)(已更新二次)

   记得看过一篇问Blog怎么用的文章,我也是新手,不过经过摸索我找到了一些使用方法,特介绍给大家,大家不要笑话我写的浅啊,新手嘛. 1.写文章,建立相册之前都先要编辑分类,写好文章后选择自己的文章的分类. 2.至于文档中心的分类,很多人不明白,为什么自己的帖子发在其他栏,别人的发在综合栏.这个其实是自己可以选择的.写完文章后,注意看这样一句话"如果您想同时发表到优快云文档中心,请勾选以下类别

5201

锂电池充电器电路设计 里面有电路

锂电池充电器电路设计 里面有电路 3.7V升压到5V电路设计。

优快云Blog使用方法

 记得看过一篇问Blog怎么用的文章,我也是新手,不过经过摸索我找到了一些使用方法,特介绍给大家,大家不要笑话我写的浅啊,新手嘛. 1.写文章,建立相册之前都先要编辑分类,写好文章后选择自己的文章的分类. 2.至于文档中心的分类,很多人不明白,为什么自己的帖子发在其他栏,别人的发在综合栏.这个其实是自己可以选择的.写完文章后,注意看这样一句话"如果您想同时发表到优快云文档中心,请勾选以下类别(可

fengplus的专栏 691

LinePhone3.2.7(android端最新版本) sip客户端

SIP客户端For android:LinePhone3.2.7(最新版本),官网地址:http://www.linphone.org/

优快云Blog的使用方法

 记得看过一篇问Blog怎么用的文章,我也是新手,不过经过摸索我找到了一些使用方法,特介绍给大家,大家不要笑话我写的浅啊,新手嘛. 1.写文章,建立相册之前都先要编辑分类,写好文章后选择自己的文章的分类. 2.至于文档中心的分类,很多人不明白,为什么自己的帖子发在其他栏,别人的发在综合栏.这个其实是自己可以选择的.写完文章后,注意看这样一句话"如果您想同时发表到优快云文档中心,请勾选以下类别(可

卢帅宇的专栏 1035

小白搭建hexo的Next主题博客

家里的网络可算搞好了!QUQ......是时候更新一波博客了! 言归正传: 寒假前无意间看到高年级的学长自己做的博客网站,很精美!动心了之后决定自己做一个“高仿版”,说实话自己没有想到如今建立自己的博客网站已经这么发达便捷,因为自己的前端知识并不多,开始前一度担心完不成。 这是效果图: 古人云:工欲成其事必先利其器。在互联网高度发达的今天,知识很容易被检索到,在纷繁世界中进行知

Hyo_yew的博客 1836

自定义博客样式

     作为女生,肯定是喜欢美好漂亮的事物,这样心情也会变好,同时每个人也希望自己是独特的,于是我想定制属于自己的博客样式,能够将所学的东西应用于实际是一件很开心的事情,于是这篇文章我决定就用于记录我设计的皮肤吧。不过我没有学过设计,所以就是凭感觉和喜好吧。不过我打算学一些这方面的,所以也期待自己的设计能够越来越好。  1. 田园桌布风(瞎定义的) 代码部分 ...

weixin_34240520的博客 124

image是否有disabled属性_CSS基本属性(三)

Transition—复合属性[检索或设置对象变换时的过渡。]<’ transition-property '>: 检索或设置对象中的参与过渡的属性none: 不指定过渡的css属性all: 所有可以进行过渡的css属性自定义属性:指定要进行过渡的css属性<’ transition-duration '>: 检索或设置对象过渡的持续时间时长:指定对象过渡的持续时间 [单位...

weixin_39649736的博客 447

web前端学习(二十八)——CSS3下拉菜单的相关设置

web前端学习(二十八)——CSS3下拉菜单的相关设置

贝尔摩德苦艾酒 1万+

CSS 盒子模型与背景渐变、文字渐变实战

content(内容区):文字、图片等实际内容占据的区域padding(内边距):内容与边框之间的空白border(边框):盒子的边界margin(外边距):盒子与其他盒子之间的间距fill:#333;important;important;fill:none;color:#333;color:#333;important;fill:none;fill:#333;height:1em;margin 外边距border 边框padding 内边距content 内容区。

2601_96876853的博客 241

CSS 弹性盒布局:子项目 flex 伸缩与 gap 间隙详解

flex-grow决定剩余空间如何分配,决定空间不足时如何压缩,flex-basis决定伸缩基准;日常优先使用flex简写,理解flex: 1与flex: auto的差异;项目间距优先使用gap,避免margin带来的首尾处理问题;注意与这两个高频细节。

2601_96876853的博客 341

CSS 定位布局:相对定位与绝对定位详解

父元素 relative + 子元素 absolute」是 CSS 中最常用的定位组合,几乎所有的角标、下拉菜单、tooltip 都基于它实现。它决定了元素在页面中的定位方式,也是实现悬浮按钮、下拉菜单、遮罩层、角标等常见 UI 效果的核心手段。的偏移只是视觉位移,不会改变元素在文档流中的占位,因此不会引起其他元素重排。在视觉上向右移动 30px、向下移动 20px,但它原本占据的空间依然保留,后面的元素不会补上来。再大也无法跳出父元素的层级。,不再占据原来的空间,其他元素会像它不存在一样重新排列。

2601_96876853的博客 265

CSS 轮播图:让内容盒子垂直居中的几种做法

做轮播图时,最常见的结构是「外层容器固定高度 + 内层内容盒子(图片、标题、按钮组)」。轮播图内容盒子的垂直居中,本质是「容器有高度 + 子元素有居中规则」。轮播容器用 Flex,内层盒子自动在两个方向居中,代码最少、兼容性最好(现代浏览器全支持)。下面按「从简单到通用」的顺序,给出几种在轮播图中真正好用的垂直居中方案。,水平居中了,但垂直方向总是贴着顶部,或者被拉伸变形。,这是不依赖 Flex/Grid 的经典写法。新项目不建议使用,仅在维护老代码时能看懂即可。是 Flex 两个属性的简写,写法更短。

2601_96876853的博客 367
上一篇: ZZ:天下无贼经典台词IT版
下一篇: 最近在看的几个东西,不知道有没有和我一样的。
changhefirst
博客等级 码龄24年 0粉丝 26原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值