海报css_如何使用HTML和CSS为《复仇者联盟：无限战争》制作海报
海报css
by Kunal
由Kunal
如何使用HTML和CSS为《复仇者联盟：无限战争》制作海报 (How to make a poster for Avengers: Infinity War in HTML and CSS)
In this post, we are going to make a movie poster of “Avengers: Infinity War” in HTML and CSS.
在本文中，我们将使用HTML和CSS制作“复仇者联盟：无限战争”的电影海报。
Here’s what we will build:
这是我们将要构建的：
Looks interesting, doesn’t it?
看起来很有趣，不是吗？
Here are some important concepts you will learn while making this poster:
制作此海报时，您将学到一些重要的概念：
- How to give a full-screen background image to your page
如何为页面提供全屏背景图像 - Centering elements horizontally in CSS
在CSS中将元素水平居中 - Centering elements vertically in CSS
在CSS中垂直居中放置元素 - Embedding Youtube videos in HTML
在HTML中嵌入YouTube视频 - What is Margin Collapse
什么是保证金崩溃 - How to load custom fonts from a local file
如何从本地文件加载自定义字体 - How to load fonts from Google fonts
如何从Google字体加载字体
This is going to be fun, so let’s dive in.
这将很有趣，所以让我们开始吧。
空白板 (The blank slate)
Let’s get on the same page first.
让我们先进入同一页面。
This is what my project folder structure looks like:
我的项目文件夹结构如下所示：
Our stylesheet “styles.css” goes inside the CSS folder, the custom font file that we will download will go inside fonts folder, the background image that we will download will go inside the img folder, and our HTML code resides in the “infinity-war.html” file.
我们的样式表“ styles.css”位于CSS文件夹中，我们将下载的自定义字体文件将位于fonts文件夹中，我们将下载的背景图像将位于img文件夹中，而我们HTML代码位于“ infinity”中-war.html”文件。
Here’s my HTML file for a blank page. We will build upon this blank page:
这是我的空白页HTML文件。 我们将在此空白页上构建：
If you don’t understand the above code, then you are probably coding in HTML for the first time. I would recommend starting here: How to Make a Burger in HTML — A Beginner Tutorial.
如果您不理解上面的代码，则可能是您第一次使用HTML进行编码。 我建议从这里开始： 如何用HTML制作汉堡-入门教程 。
完整背景图片 (Full background image)
First download the image and save it in “img” folder.
首先下载图像并将其保存在“ img”文件夹中。
Note: All rights of the image belongs to Marvel Studios, used here only for learning purposes.
注意：图片的所有权利均归Marvel Studios所有，此处仅用于学习目的。
We normally use the <img> element to include images in HTML. But for this specific purpose we will create a div, make that div cover the entire screen, and then set the background image on that div using the "background-image" CSS property.
通常，我们使用<i mg>元素在HTML中包含图像。 但是出于此特定目的，我们将创建一个div，使该div覆盖整个屏幕，然后使用“ background-image” CSS属性在该div上设置背景图像。
Here’s our HTML:
这是我们HTML：
and our CSS:
和我们CSS：
As you can see, we created a div and gave it a class in our HTML file. In our CSS file, we set the width and height to 100% so that it covers the entire screen. We set the background image using the “background-img” property.
如您所见，我们在HTML文件中创建了一个div并为其提供了一个类。 在我们CSS文件中，我们将宽度和高度设置为100％，以便覆盖整个屏幕。 我们使用“ background-img”属性设置背景图像。
Notice how we are referencing the image file: url("../img/infinity-war-wallpaper.jpg"). You see that .. at the beginning of the path? See, we are referencing the image file which is in the "img" folder from our styles.css file which is in the "css" folder, right?
注意我们如何引用图像文件： url("../img/infinity-war-wallpaper.jpg") 。 您将看到..在路径的开始？ 瞧，我们从“ css”文件夹中的styles.css文件中引用了“ img”文件夹中的图像文件，对吗？
So we need to go one folder out and then reference the path. That .. takes us one folder up in the folder structure.
因此，我们需要移出一个文件夹，然后引用路径。 那..将我们带入文件夹结构中的一个文件夹。
Let’s refresh the page in the browser and see the result.
让我们在浏览器中刷新页面并查看结果。
Aaand, it’s still a blank page.
Aaand，它仍然是空白页。
Actually, we are missing one detail here.
实际上，我们在这里缺少一个细节。
When we set height or width in %, say 100% in our case, it’s not 100% of the screen — it’s 100% of its parent’s dimension.
当我们将高度或宽度设置为％时(例如100％)，它不是屏幕的100％，而是其父级尺寸的100％。
What is the parent element of the div? <body>. What is the parent element of the body? <html>.
div的父元素是什么？ <bo dy>。 body?的父元素是body? <html>。
So, we need to set the height of our body and HTML elements to 100%. Let’s do that and see if it works:
因此，我们需要将主体和HTML元素的高度设置为100％。 让我们来看看它是否有效：
Now we get this output:
现在我们得到以下输出：
Okay, if you look at it carefully you will see there are two issues here:
好的，如果仔细看，会发现这里有两个问题：
- there is a white gap around the image — do you see that?
图像周围有白色缝隙-您看到了吗？ - the image is zoomed in, isn’t it?
图像放大了，不是吗？
Let’s tackle these issues one by one.
让我们一一解决这些问题。
The body element by default has some margin to it. That’s why we see that gap around the image.
默认情况下，body元素具有一定的余量。 这就是为什么我们看到图像周围有间隙。
Let’s remove the margin by setting it to 0 on the body:
让我们通过将其上的边距设置为0来删除边距：
Refresh the browser and you will see that the white gap is gone and there is no scrollbar now.
刷新浏览器，您将看到白色缝隙消失了，并且现在没有滚动条。
Next, let’s solve the image scaling problem. By default, the image will be displayed in its original size. We can change this to scale the image in such a way that it will cover the screen by setting the “background-size” property to “cover”.
接下来，让我们解决图像缩放问题。 默认情况下，图像将以其原始尺寸显示。 通过将“ background-size”属性设置为“ cover”，我们可以更改它以缩放图像，使其覆盖屏幕。
We also set the backgound-position to center the background image.
我们还设置背景位置以使背景图像居中。
Both the problems are solved.
这两个问题都解决了。
保证金崩溃 (Margin collapsing)
Let’s add a heading using the <h1> element and give it white color using the "color" property in CSS:
让我们使用< h1>元素添加标题，并使用CSS中的“ color”属性将其赋予白色：
and our CSS:
和我们CSS：
Output:
输出：
We messed up something. Where did that white gap come from?
我们搞砸了。 白色差距从何而来？
Well, it turns out, the h1 element, just like the body element, also has some margin by default, and so do the h2, h3, h4, h5 and h6 elements.
好吧，事实证明，h1元素与body元素一样，默认情况下也具有一定的余量，h2，h3，h4，h5和h6元素也是如此。
But, even if the h1 element had a margin, it must be displayed with some gap inside the div with our background image. So why did it display a gap outside the div?
但是，即使h1元素有一个保证金，必须与我们的背景图像的DIV 里面的一些差距显示。 那么，为什么它在div 之外显示出空白呢？
Ideally, it should have been displayed like this:
理想情况下，应该这样显示：
But it instead displays a gap above the “full-bg” div.
但相反，它在“ full-bg” div上方显示了一个缺口。
This happens because of Margin Collapsing.
这是由于保证金崩溃而发生的。
When you have two block elements (the div and h1 in our case), and the parent element doesn’t have any padding or border, then the top and bottom margin of the child element will be displayed as the top and bottom margin of the parent. This is called Margin Collapsing. The margin of the child collapses with the margin of the parent.
当您有两个块元素(在本例中为div和h1)，并且父元素没有任何填充或边框时，子元素的顶部和底部边距将显示为子元素的顶部和底部边距。父母 这称为“保证金崩溃”。 孩子的边缘与父母的边缘一起崩溃。
If the parent element has a padding even of just 1px, or has a border of at least 1px, then this won’t happen. Let’s give 1px padding to our “full-bg” div and see its effect:
如果父元素的填充量仅为1px，或者边框至少为1px，则不会发生这种情况。 让我们给“ full-bg” div加上1px的填充，看看它的效果：
The margin collapsing is fixed.
边距折叠是固定的。
But — did you notice a tiny difference?
但是-您注意到微小的差异了吗？
Your browser now has a horizontal and vertical scrollbar. That means the width and height of the div have increased.
您的浏览器现在具有水平和垂直滚动条。 这意味着div的宽度和高度已经增加。
How?
怎么样？
填充和边框会增加元素的大小 (The padding and the border increase the size of the element)
This is one more default behavior that you must remember. Say you create a div of 100px x 100px, and give it a padding of 10px. The div will now become 110px x 110px.
这是您必须记住的另一种默认行为。 假设您创建一个100px x 100px的div，并将其填充为10px。 div现在将变为110px x 110px。
Yes, the amount of padding you give to an element is added to the dimension of the element. It’s the same with the border: if you give a 4px border to your element, its size will increase by 4px.
是的，您赋予元素的填充量已添加到元素的尺寸中。 边框也一样：如果为元素设置4px边框，则其大小将增加4px。
We ideally don’t want to increase the size of the element, but rather shrink the content inside the element to make up space for the padding and border.
理想情况下，我们不想增加元素的大小，而希望缩小元素内部的内容，以填充边框和边框的空间。
We can achieve this by setting the “box-sizing” property to “border-box”. Let’s do that:
我们可以通过将“ box-sizing”属性设置为“ border-box”来实现。 让我们这样做：
Refresh your browser. Bam, the scroll bars are gone.
刷新浏览器。 Bam，滚动条不见了。
节和标题 (Section and header)
If you saw the end result picture, you will see we still need to add a sub-header, a YouTube video, and the release date. It’s a good practice to group all these elements into a section, since these elements are related to each other. Let’s create a section using the <section> tag and put our h1 inside it:
如果您看到了最终结果图片，您将看到我们仍然需要添加子标题，YouTube视频和发行日期。 将所有这些元素归为一个部分是一个好习惯，因为这些元素是相互关联的。 让我们使用<secti on>标记创建一个节，并将h1放入其中：
All the elements of our poster will go inside this “poster-content” section.
海报的所有元素都将放在“海报内容”部分中。
You might be wondering why we didn’t use “div” here — why “section”?
您可能想知道为什么我们在这里不使用“ div”-为什么选择“ section”？
Actually, before HTML5, everything used to be “div”. In fact, we can make entire websites with only “div” elements. But we don’t do that because it makes more sense to include an image with the <img> element, it makes more sense to include a paragraph with the <p> element, and similarly, it makes more sense to group content of similar theme in the <section> element.
实际上，在HTML5之前，以前都是“ div”。 实际上，我们可以只使用“ div”元素制作整个网站。 但是，我们不这样做，因为它更有意义，包括与在<img>元素的图像时，它更有意义，包括一段机智ht他<p>元素，同样，它更有意义的内容组类似吨heme in t他<节>的元素。
So, the rule of thumb is, use <div> when you want a container only for giving the content some style (like our "full-bg" div), and use <;section> when you want a container to group similarly-themed content.
因此，经验法则是，当您只希望容器为内容提供某种样式时(例如我们的“ full-bg” div)，请使用<d iv>；当您希望容器进行分组时，请d use < ; section>类似主题的内容。
Next, we also know there is going to be a subheading. Luckily, HTML5 has an element to group heading elements — the <header> element. Let's include that too:
接下来，我们也知道会有一个子标题。 幸运的是，HTML5有一个用于分组标题元素的元素- <head er>元素。 让我们也包括在内：
We must also update the selectors in our CSS:
我们还必须更新CSS中的选择器：
Now, as soon as you hit refresh, you will notice that the font of our h1 element becomes smaller.
现在，一旦您单击刷新，您将注意到我们的h1元素的字体变小了。
Many browsers reduce the font size of the h1 element when placed inside a <section> or a <;article> element. So it's best to give the size to our h1 manually whenever it’s placed inside <section> or <article>:
当放置在<secti on> or a < ; article>元素内时，许多浏览器会减小h1元素的字体大小。 因此，最好在出现aced insi de＆ lt;sectio n>或<article>时手动将其大小赋予我们的h1：
透明背景 (Transparent background)
Let’s give a black semi-transparent background color to our section element:
让我们为section元素提供黑色的半透明背景色：
output:
输出：
The code “rgba(0, 0, 0, 0.6)” means: color with 0 red, 0 green and 0 blue components, which is black, and 60% opaqueness.
代码“ rgba(0，0，0，0.6)”表示：颜色具有0个红色，0个绿色和0个蓝色成分(黑色)和60％不透明度。
Two things: we don’t want the text to stick to the borders of the semi-transparent box. Second, we want to give the section a fixed width and align it to the center.
两件事情：我们不希望文本粘贴到半透明框的边框上。 其次，我们要给该部分固定的宽度并将其与中心对齐。
Let’s do this:
我们开工吧：
We gave a padding of “16px” and set the “box-sizing” to “border-box” because we don’t want the container to expand by 16px to make space for padding. Rather we want the container to remain the same size and the content inside it to shrink to make space for 16px of padding.
我们将填充设为“ 16px”，并将“ box-sizing”设置为“ border-box”，因为我们不希望容器扩展16px来留出填充空间。 相反，我们希望容器保持相同的大小，并且容器中的内容缩小以为16px的填充空间。
Output:
输出：
Okay, the top and bottom gap surely don’t look like “16px” — they look like much more than that. And if you noticed, the section wasn’t touching the top edge of the browser before, but now it is. What’s happening?
好吧，顶部和底部的间隙肯定看起来不像“ 16px”-它们看起来远不止于此。 而且，如果您注意到了，该部分之前并没有触及浏览器的顶部边缘，但现在已经触及了。 发生了什么？
It’s margin collapse at play again. The extra space above and below h1 is not the padding of the section, it’s the margin of the h1. Previously we didn’t have any padding on the section so the margin of h1 and section collapsed and was displayed outside the section. That’s why the section was not touching the top before.
利润率再次下降。 h1上方和下方的多余空间不是该部分的填充，而是h1的边距。 以前我们在该部分上没有任何填充，因此h1和section的边距折叠并显示在该部分外部。 这就是为什么该部分之前未触及顶部的原因。
Let’s reduce the margin of h1 and center it by setting “text-align: center” for our <header> element:
让我们通过为<head er>元素设置“ text-align：center”来减少h1的边距并将其居中：
Refresh the page and the h1 text should be centered now with relatively less space around it.
刷新页面，h1文本现在应该居中，并且周围的空间相对较小。
灵活地将事物居中 (Flex to center things)
Our section is already centered horizontally, because of the “margin: auto”.
由于“边距：自动”，我们的区域已经水平居中。
What “margin: auto” does is it sets the margins on all sides (margin-top, margin-right, margin-bottom and margin-left) to “auto”.
“ margin：auto”的作用是将所有边距(上边距，右边距，右边距，左边距和左边距)设置为“ auto”。
We know that setting margin-left and margin-right to “auto” centers the element horizontally.
我们知道将margin-left和margin-right设置为“ auto”会使元素水平居中。
But setting margin-top and margin-bottom to “auto” doesn’t automatically center an element vertically. Historically, centering things in HTML has been one of the big hair-pulling moments for web developers.
但是将margin-top和margin-bottom设置为“ auto”不会自动将元素垂直居中。 从历史上看，以HTML居中一直是Web开发人员面临的重大挑战之一。
Not anymore. Now that Flexbox is widely supported by all browsers, we can use “display: flex” on an element. That element will become a “flex container” and its children will become “flex-items”.
不再。 现在所有浏览器都广泛支持Flexbox，我们可以在元素上使用“ display：flex”。 该元素将成为“弹性容器”，其子元素将成为“弹性项目”。
Flex items have some great properties. For example, when the margin-top and margin-bottom of flex items are set to “auto”, it centers vertically!
弹性项目具有一些出色的属性。 例如，将弹性项目的页边距上下边缘设置为“自动”时，它会垂直居中！
Let’s give it a shot, add “display: flex” to “.full-bg”:
让我们试一下，在“ .full-bg”中添加“ display：flex”：
Output:
输出：
Okay, now it’s starting to look good.
好的，现在开始看起来不错。
从本地系统加载自定义字体 (Load a custom font from a local system)
If we really want to make it look cool, we will need a custom font for our header.
如果我们真的想让它看起来很酷，我们将需要一个自定义字体作为标题。
Have a look at this font on “dafont.com”:
在“ dafont.com”上查看此字体：
This looks perfect for our use, so you can download it here.
这看起来很适合我们使用，因此您可以在此处下载。
If you extract the zip file, you will see font files in TTF and OTF formats. We can use these, but WOFF format is the best way to go when using any custom font for CSS. Go ahead and convert any one of the TTF files to WOFF using this online tool.
如果解压缩该zip文件，您将看到TTF和OTF格式的字体文件。 我们可以使用这些，但是WOFF格式是在CSS中使用任何自定义字体时的最佳方法。 继续，使用此在线工具将任何一个TTF文件转换为WOFF。
Then we will place the converted .woff file inside the “fonts” directory.
然后，我们将转换后的.woff文件放置在“字体”目录中。
Let’s load our font:
让我们加载字体：
Note: If you are using Firefox, you will have to allow local font files to load. Type about:config in the address bar in Firefox and hit enter. Accept the warning. Then search “strict_orogin_policy” and turn it false.
注意：如果使用的是Firefox，则必须允许加载本地字体文件。 在Firefox的地址栏中输入about：config，然后按Enter。 接受警告。 然后搜索“ strict_orogin_policy”并将其设置为false。
Output:
输出：
Alright, now we are talking.
好吧，现在我们在谈论。
设置“标题” (Styling the “header”)
Now, let’s write “Infinity War” as a sub-header as h2 and give a top and bottom border.
现在，让我们将“无限战争”作为子标题写为h2并给出上下边界。
and our CSS:
和我们CSS：
Output:
输出：
Okay, two problems here:
好的，这里有两个问题：
- the gap between h1 and h2,
h1和h2之间的差距， - we don’t want the white lines (top and bottom border of h2) to span the entire section. We want it as wide as the “Avengers” text.
我们不希望白线(h2的顶部和底部边框)跨越整个部分。 我们希望它与“复仇者”文本一样宽。
To reduce the gap between h1 and h2, let’s remove the margin-bottom of h1 and margin-top of h2:
为了缩小h1和h2之间的距离，让我们删除h1的下边距和h2的上边距：
The code “margin: 16px 8px 0” means set the top margin to 16px, right and left margin to 8px, and bottom margin to 0.
代码“ margin：16px 8px 0”表示将顶部边距设置为16px，将左右边距设置为8px，将底部边距设置为0。
Now for the second problem.
现在是第二个问题。
The <header> element is by default a block element, so its width spans over its parent’s width. If we make it an “inline-block” element, then it won’t expand to its parent’s width, and will only occupy the width required to fit the text inside it. That’s exactly what we want.
默认情况下，<header>元素是一个block元素，因此其宽度跨越其父元素的宽度。 如果我们将其设置为“ inline-block”元素，则它将不会扩展到其父级的宽度，而只会占据适合其内部文本的宽度。 这正是我们想要的。
Let’s give “display: inline-block” to the header and “text-align: center” to its parent “poster-content”:
让我们给标题加上“ display：inline-block”，并给它的父“ poster-content”加上“ text-align：center”：
Output:
输出：
自定义Google字体 (Custom Google font)
Let’s use a sci-fi font for h2. We saw how to download a font and use it in our CSS. In such a scenario, you are hosting the font yourself. Google provides many hosted fonts for free here. We just link it from Google. Here is one that looks good for our use:
让我们为H2使用科幻字体。 我们看到了如何下载字体并在CSS中使用它。 在这种情况下，您将自己托管字体。 Google 在这里免费提供了许多托管字体。 我们只是从Google链接它。 这是一个适合我们使用的外观：
Here’s the URL.
这是URL 。
Go to the URL above and click “SELECT THIS FONT” on the right side of the screen:
转到上面的URL，然后单击屏幕右侧的“选择此字体”：
Then click on the “Family Selected” bar displayed at the bottom:
然后单击底部显示的“选定的家庭”栏：
That will give us the code to copy to use that font on our page:
这将为我们提供复制代码以在页面上使用该字体的代码：
Paste the <link> code to our HTML file:
将<li nk>代码粘贴到我们HTML文件中：
and the font-family code to our CSS:
以及我们CSS的字体系列代码：
I also added some letter-spacing, since the letters were looking congested. I also increased the font-size to 26px.
我还添加了一些字母间距，因为字母看上去很拥挤。 我也将字体大小增加到26px。
Output:
输出：
嵌入YouTube视频 (Embed the YouTube video)
The movie poster will be incomplete without a video of the trailer.
没有预告片的视频，电影海报将是不完整的。
We can include the YouTube video in our HTML page using “iframe”. The “iframe” tag allows us to load another HTML page in the current page. Which page to load is decided by the “src” attribute.
我们可以使用“ iframe”将YouTube视频添加到HTML页面中。 “ iframe”标签可让我们在当前页面中加载另一个HTML页面。 加载哪个页面由“ src”属性决定。
Here’s how you can use <iframe> to include a video from Youtube:
您可以使用<iframe>包括Youtube的视频，方法如下：
<iframe src="https://www.youtube.com/embed/6ZfuNTqbHE8"></iframe>The text “https://www.youtube.com/embed/" in “src” remains the same for all Youtube videos. Only the last random-looking string “6ZfuNTqbHE8” changes for each video. That’s the ID of the video, and you can find it in the video’s URL:
对于所有YouTube视频，“ src”中的文本“ https://www.youtube.com/embed/ ”均保持不变。每个视频只有最后一个看起来随机的字符串“ 6ZfuNTqbHE8”会更改。这就是视频的ID，您可以在视频的网址中找到它：
Let’s include the Trailer video:
让我们包括预告片视频：
Output:
输出：
Damn. What went wrong now?
该死的。 现在出了什么问题？
Can you guess why the video is displayed to the right of the header?
您能猜出为什么视频显示在标题的右侧吗？
Because we set the header as “inline-block”, and as we know, an inline-block element will give place to the next element just beside it.
因为我们将标头设置为“ inline-block”，并且众所周知，所以inline-block元素将放置在旁边的下一个元素处。
To solve this, let’s give some width and height to our iframe element:
为了解决这个问题，让我们为iframe元素提供一些宽度和高度：
The default border of the iframe was looking ugly, so I added a 2px border of “#ddd” color (almost white).
iframe的默认边框看起来很难看，因此我添加了2px“ #ddd”颜色(几乎是白色)的边框。
Output:
输出：
Great.
大。
One last thing — the release date. Let’s put the release date in a paragraph at the bottom:
最后一件事-发布日期。 让我们将发布日期放在底部的一个段落中：
and style the paragraph a bit:
并对段落进行样式设置：
We increased the font size to 18px, gave it white color (#fff), set the font to “Audiowide”, and reduced the bottom margin to “8px”.
我们将字体大小增加到18px，为其赋予白色(#fff)，将字体设置为“ Audiowide”，并将下边距减小为“ 8px”。
Output:
输出：
Our Infinity War movie poster is complete.
我们的无限战争电影海报已经完成。
Want to learn Web Development with fun and engaging tutorials?
是否想通过有趣而引人入胜的教程来学习Web开发？
Click here to get new Web Development tutorials every week.
单击此处每周获取新的Web开发教程。
翻译自: https://www.freecodecamp.org/news/how-to-make-a-poster-for-avengers-infinity-war-in-html-and-css-304d305c7f7/
海报css
海报css_如何使用HTML和CSS为《复仇者联盟：无限战争》制作海报相关推荐
- 成功制作海报的十个简单法则
海报是将你的研究成果与别人交流过程中的关键部分,也是成功科 研生涯的重要元素.虽然同样传递着高质量的科学信息,海报无论从口 头讲演或以文献发表的形式都提供了一个不同的媒介,所以应该区别对 待.你的海报 ...
- 赛效：在线制作海报用图司机编辑工具
当一项活动需要进行促销或者进行宣传时,大家通常会制作一些手机海报,群发手机海报消息,或者在手机微信朋友圈直接发送海报分享,以便帮助大家吸引客户提高产品的知名度. 制作手机海报可以选择一些可以快捷制作海 ...
- H5上传图片并使用canvas制作海报
马上就要"十一"国庆节了,又恰逢公司已经三周岁了,所以市场部和产品共同策划了一个"正青春,共成长"的主题代言活动,准备在国庆节以及中秋节期间让公司员工和用户为公 ...
- CSS动画效果无限循环放大缩小
效果图: CSS动画效果无限循环放大缩小 <image class="anima" mode="widthFix" @click="nav&qu ...
- 用 Python 快速制作海报级地图
作者:费弗里 来源:Python大数据分析 1 简介 基于Python中诸如matplotlib等功能丰富.自由度极高的绘图库,我们可以完成各种极富艺术感的可视化作品,关于这一点我在系列文章在模仿中精 ...
- 如何在PPT中用文本框制作海报？这个方法很简单，不信来看
PPT里还能用文本框制作海报,你知道吗?很多朋友可能觉得很诧异,一般大家做海报都是用PS来制作,可是PS的操作有点复杂,还是一个细致活,急躁的朋友可能做着做着就没耐心了,不过这个也不妨碍制作海报,直接 ...
- 海报看起来很普通？数字平原概念设计来制作
海报看起来很普通?数字平原概念设计来制作 一个普通的瓶子要怎样做海报?本次数字平原陈工将使用可乐瓶加上复杂的赛博朋克概念作出全新的海报风格.这种就是属于概念设计,在产品的广告商经常能见.概念设计在各个 ...
- java制作海报一：java使用Graphics2D 在图片上写字，文字换行算法详解
文章目录 前言 一.直接上代码 1. 写字方法 2. 换行算法 二. 叙述换行算法 前言 代码都上传到GitHub了,这里仅仅是贴出来主要部分,GitHub传送门:https://github.com ...
- 如何使用Microsoft PowerPoint制作海报
Microsoft PowerPoint isn't just for presentations-it also provides all of the creative tools you nee ...
最新文章
- c语言整型数组操作,c语言的数组操作|时刻需
- JVM的方法区和永久带是什么关系？
- spark sql 的性能调优
- python实现递归和非递归求两个数最大公约数、最小公倍数
- CentOS6.x定制~修改CentOS字样
- mysql插入汉子1366_mysql 向列表中添加漢字錯誤 １３６６
- Grad-CAM在语义分割中的pytorch实现
- SQL Server常用数据类型
- python获取文字坐标_python坐标获取
- 从轻盈奶茶到拉普山鲜奶茶，罗曼林实现品类突围
- 线性丢番图方程的C++实现
- JAVA学习代码——验证手机号码是否正确
- 杨桃文案：卖杨桃水果怎样写文案发朋友圈，水果店杨桃活动文案
- 余弦相似度计算的实现方式
- Android:访问存储失败.FileNotFoundException open failed: XXXXXXX EPERM (Operation not permitted)
- 数据分析总结一：数据分析思维
- java字符串替换多个字符串_java 字符串替换函数replaceAll 一次同时替换多个字符串...
- matlab 中去除含有NaN的行或者列
- postgresql 开启远程访问、postgre设置开机自启动、psql: error: FATAL: Peer authentication failed for user “postgres“
- 蒙特卡洛模拟计算风险价值VAR之R语言实现