Blockquote增加额外的<br/>

Question

为什么blockquote会在其末尾添加额外的br以及如何避免它？ 如何删除添加的额外br，以便我的所有行都在一起＆gt;

.container-content .main-content .container-test pre {
  font-family: monospace;
  white-space: pre;
  word-break: break-all;
  color: #ececec;
  border: none;
  padding: 0;
  background-color: transparent;
}

blockquote {
  padding: 0px 10px 0px;
  margin: 0 0 0px;
  border-left: 3px solid #2471A3;
}

<div class="container-test">
<pre>
test test tesst
test test tesst
test test tesst
test test tesst
<blockquote>test test tesst
test test tesst
test test tesst
test test tesst</blockquote>
test test tesst
test test tesst
test test tesst
test test tesst
</pre>
</div>

Answer 1

您在阻止引用后有额外br的原因是因为您正在使用<pre>标记。 pre标记格式化文本的方式与在代码中编写文本的方式完全相同。所以你有两个解决方案

1. 按照您希望的样子格式化代码
＆＃13;
＆＃13;
.container-test {
  font-family: monospace;
}

blockquote {
  padding: 0px 10px 0px;
  margin: 0 0 0px;
  border-left: 3px solid #2471A3;
}
＆＃13;
<div class="container-test">
<pre>
test test tesst
test test tesst
test test tesst
test test tesst
<blockquote>test test tesst
test test tesst
test test tesst
test test tesst</blockquote>test test tesst
test test tesst
test test tesst
test test tesst
</pre>
</div>
＆＃13;
＆＃13;
＆＃13;
1. 完全避免使用pre，并为容器添加宽度。
＆＃13;
＆＃13;
.container-test {
  font-family: monospace;
  width: 150px;
}

blockquote {
  padding: 0px 10px 0px;
  margin: 0 0 0px;
  border-left: 3px solid #2471A3;
}
＆＃13;
<div class="container-test">
test test tesst
test test tesst
test test tesst
test test tesst
<blockquote>
test test tesst
test test tesst
test test tesst
test test tesst
</blockquote>
test test tesst
test test tesst
test test tesst
test test tesst
</div>
＆＃13;
＆＃13;
＆＃13;

您可以详细了解pre代码here。

Answer 2

您可以设置

import pygame, sys
from pygame.locals import *

import random
from random import shuffle
back = True
backbutton = pygame.image.load("Back button.png")
helpsection = pygame.image.load("Hunt Help section.png")
class Game():
    def question(self):

        questions = ["What species of bird is also a nickname for New Zealand?",
                     "Which Twins can you play as in Assassin's Creed Syndicate?",
                     "Which year was 'Killing In The Name' Christmas Number one?"]

        answers = [["kiwi", "Kiwi", "Falcon", "Sparrow", "Crow"], ["frye", "Frye", "Bank", "Green", "Bundy"],
                   ["2009", "2009",
                    "1999", "1993",
                    "2004"]]
        # I had to do it in two separate lists as it's easier to work with later on
        # Also I made the correct answers non-case sensitive to make it easier to test.

        Game_back = True

        while Game_back == True:

            r = len(questions)
            score = 0
            s = random.randrange(0, r, 1)
            # This generates a random number within the range of how many questions there are
            # and then prints out that question
            print(questions[s])

            list = answers[s]
            output = []

            for i in range(1, 5):
                output.append(answers[s][i])
            shuffle(output)
            print(output[0] + "     ", output[1] + "     ", output[2] + "      ", output[3])
            # this takes the answers that correspond with the randomly generated question and shuffles the answers
            # I did this as otherwise, the answer would always be the first answer to appear and the player could exploit this

            player_answer = input()

            if player_answer == answers[s][0] or player_answer == answers[s][1]:
                score += 1
                print(score)
            else:
                print("Wrong")
            panswer = input("Would you like to play another round?: ")

            quit = ["Yes", "yes", "Yeah", "yeah"]

            if panswer in quit:
                Game_back = False
            else:
                pygame.quit()
                sys.exit()
            # this is the basics of the algorithm that will determine if a player can move forward or not in the maze and the score
            # they will have at the end
            ## it takes the input from the player and compares it to the first 2 answers in the corresponding answer set which is
            ## a separate list from the list that is printed out to the player

    def help(self):

        pygame.init()
        self.FPS = 60
        self.fps_clock = pygame.time.Clock()
        self.surface = pygame.display.set_mode((640, 480))
        # This class sets the basic attributes for the window.
        # The clock is set to 60 and the name of the window
        # is set to The Hunt which is a working title for my project
        DISPLAY_SURF.blit(helpsection, (0, 0))
        DISPLAY_SURF.blit(backbutton, ((640 - 124), (480 - 87)))
        if event.type == MOUSEBUTTONDOWN:
            if (640 -124) >= mouse[0] > 640 and (480 - 87) >= mouse[1] > 480:
                back = False
        while True:
            pygame.display.update()
            self.fps_clock.tick(self.FPS)
            for event in pygame.event.get():
                if event.type == QUIT:
                    pygame.quit()
                    sys.exit()


            # This updates the window display to refresh every clock tick
            # and to set the background colour as white
            # using the RGB colours. I might use these to alter the window's look at a later date





#Initialize pygame and define colours
pygame.init()
white = 255, 255, 255

#Sets the resolution to 640 pixels by 720 pixels and caption for pygame window
DISPLAY_SURF = pygame.display.set_mode((640, 720))
pygame.display.set_caption("The Hunt!")



#Create a clock object
clock = pygame.time.Clock()
FPS = 60

#Define a variable to refer to image
background = pygame.image.load("Startermenu.png")
start = pygame.image.load("PlayGameButton.png")
help = pygame.image.load("HelpButton.png")
credits = pygame.image.load("ShowCreditsButton.png")

Hoveringhelp = pygame.image.load("HoveringHelpButton.png")


#Start main loop
while True:
    for event in pygame.event.get():
        mouse = pygame.mouse.get_pos()
        DISPLAY_SURF.fill(white)
        DISPLAY_SURF.blit(background, (0, 0))
        DISPLAY_SURF.blit(start, (0, 140))
        DISPLAY_SURF.blit(help, (0, 186))
        DISPLAY_SURF.blit(credits, (0, 235))
        pygame.display.update()
        #if 0 <= mouse[0] < 260 and 180 <= mouse[1] < 230:
         #   DISPLAY_SURF.blit(Hoveringhelp, (0, 186))
          #  print("hovering over help")
        #elif 0 <= mouse[0] < 260 and 235 <= mouse[1] < 270:
         #   print("hovering over credits")
        #elif 0 <= mouse[0] < 260 and 0 <= mouse[1] < 180:
         #   print("hovering over play button")
        if event.type == MOUSEBUTTONDOWN:
            if 0 <= mouse[0] < 260 and 140 <= mouse[1] < 180:
                game = Game()
                game.question()
            elif 0 <= mouse[0] < 260 and 180 <= mouse[1] < 230:
                game = Game()
                game.help()
            elif 0 <= mouse[0] < 260 and 240 <= mouse[1] < 285:
                game = Game()
                game.credits()
        elif event.type == QUIT:
            pygame.quit()
            sys.exit()

Answer 3

设置blockquote的显示属性（请使用更好的选择器）作为内联块。

＆＃13;

＆＃13;

 .container-test pre {
  font-family: monospace;
  white-space: pre;
  word-break: break-all;
}

.container-test pre blockquote {
  padding: 0px 10px 0px;
  margin: 0 0 0px;
  border-left: 3px solid #2471A3;
  display:inline-block;
}

＆＃13;

<div class="container-test">
<pre>
test test tesst
test test tesst
test test tesst
test test tesst
<blockquote>test test tesst
test test tesst
test test tesst
test test tesst </blockquote>
test test tesst
test test tesst
test test tesst
test test tesst
</pre>
</div>

＆＃13;

＆＃13;

＆＃13;