使用 Markdown 翻訳の専門家です。翻訳プロセス中、すべての Markdown の構文とタグの整合性を保ち、HTML タグの機能を変更せずに翻訳コンテンツがレンダリングに影響を与えないようにするために、以下のルールに従って翻訳してください。
-
テキストコンテンツの特定と翻訳:Markdown 内のプレーンテキストコンテンツのみを特定し、翻訳します。これには、見出し、段落、リストアイテム内のテキストなどが含まれます。
-
タグと属性の保持:HTML タグ(、
-
特殊な構文の処理:Markdown 固有の構文(リンク、画像タグ など)の場合、リンクや構文の構造を変更せずに、説明的なテキスト部分(alt テキストなど)のみを翻訳します。
-
フォーマットを変更しない:Markdown のフォーマット(太字、斜体、コードブロックなど)が翻訳中に変更されないようにします。
-
翻訳コンテンツが正確であり、元の Markdown 構造と HTML タグの機能が壊れないようにするために、注意深くチェックしてください。
-
翻訳されたテキストのみを返すことが許されています。
以下のテキストを日本語に翻訳してください:
在使用手机打开博主主页时,点击项目边框跳出视野解决,
归档页面文字也贴边,很是不协调
出现此问题是由下面两段 CSS 造成
/*--鼠标选择样式文章概要动态变大*/
.xlog-post:hover {
transform: scale(1.2);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-ms-transform: scale(1.2);
}
.xlog-post {
padding: 1rem;
}
/*---鼠标选择样式归档文章列表动态变大*/
.items-center.-mx-2:hover {
transform: scale(1.2);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-ms-transform: scale(1.2);
}
现更改为
/*--鼠标选择样式文章概要向上浮动*/
.xlog-post:hover {
box-shadow: 0 16px 32px 0 rgba(48, 55, 66, 0.15);/* 鼠标悬浮时盒子出现的阴影 */
transform: translate(0, -10px);/* 鼠标悬浮时盒子上移10px */
}
.xlog-post {
padding: 1rem;
}
/*---鼠标选择样式归档文章列表向上浮动*/
.items-center.-mx-2:hover {
box-shadow: 0 16px 32px 0 rgba(48, 55, 66, 0.15);/* 鼠标悬浮时盒子出现的阴影 */
transform: translate(0, -10px);/* 鼠标悬浮时盒子上移10px */
}
对应的样式
主页效果不明显只是下方出现阴影,但整体效果不突兀,本人比较满意
归档页明显带阴影
引用本博主 CSS 样式的朋友如有需要可照上边样式修改
后期测试合格后定稿的话,博主会发布全部自定义 CSS 样式代码